如何在Chrome开发工具中使用jQuery DataTables API
How to use the jQuery DataTables API in Chrome Developer Tools?
我正在努力掌握DataTables API的工作原理。因此,我想在Chrome开发工具中执行一些简单的调用,并实时查看结果。
想象一下,你有一个简单的表格,标题是Foo和Bar:
---------
|Foo|Bar|
---------
|1 |a |
---------
|2 |b |
---------
在Chrome开发工具中,我想做以下事情:
var table = $('.datatable').DataTable();
table.search('a').draw();
之后,只应显示第一行。然而,这不起作用。我也尝试使用$('.datatable').dataTable().api();
而不是$('.datatable').DataTable();
,但仍然无法实现。你知道如何做到这一点吗?
必须单独注入每个脚本,初始化dataTable,然后可以使用$_
作为dataTable API的引用:
-
注入jQuery:
var s = document.createElement('script'); s.src = "//ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"; document.getElementsByTagName('head')[0].appendChild(s);
等待控制台响应:
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
注入数据表:
var s = document.createElement('script'); s.src ="https://cdn.datatables.net/1.10.9/js/jquery.dataTables.js"; document.getElementsByTagName('head')[0].appendChild(s);
等待控制台响应:
<script src="https://cdn.datatables.net/1.10.9/js/jquery.dataTables.js"></script>
初始化您的表格:
jQuery('.dataTable').DataTable();
控制台将响应:
[]
现在,您可以使用
$_
:为初始化的数据表使用API$_.search('a').draw(); $_.search('').draw(); $_.column(1).visible(false);
等等。但不知何故,我认为小提琴作为操场更方便->http://jsfiddle.net/j92jh4fo/:)
相关文章:
- Jquery Datatables错误:无效的JSON基元:draw
- JQuery Datatables将复选框设置为选中
- jQuery Datatables:单个列搜索不起作用
- jQuery Datatables-从搜索中只返回表中的前5行
- jQuery Datatables:单击一列时对另一列进行排序
- jQuery dataTables基于类型的列筛选不起作用?Img alt过滤器/排序
- 等效于mRender,基于Jquery Datatables中的底层数据进行排序
- Jquery DataTables 不适用于使用 javascript 追加 html
- jQuery DataTables页面刷新
- jQuery DataTables排序不起作用
- JQuery Datatables AJAX源的行数据
- 自定义属性jquery Datatables
- jQuery Datatables分页设置
- jQuery DataTables插件:排序德国日期
- Jquery DataTables服务器端语法错误:意外的标记<
- jQuery dataTables对包装宽度的更改只有在加载chrome's检查员
- Jquery Datatables没有't按显示长度过滤行
- jQuery UI选项卡中的jQuery DataTables
- jQuery DataTables yadcf大于等于(日期)
- jQuery DataTables:纯数组或Object