DataTables DOM定位
datatables默认会打开部分特性,比如搜索框,分页显示等等,或许你不喜欢datatables这样去布局,可能你想把分页按钮放在底部的中间,搜索框放在顶部的左上角,不用担心datatables考虑到这个问题,使用dom选项就可以灵活配置各个特性的位置
datatables定义了10个字符表示不同的组件
- l - Length changing 每页显示多少条数据选项
- f - Filtering input 搜索框
- t - The Table 表格
- i - Information 表格信息
- p - Pagination 分页按钮
- r - pRocessing 加载等待显示信息
- < and > - div elements 一个div元素
- <"#id" and > - div with an id 指定id的div元素
- <"class" and > - div with a class 指定样式名的div元素
- <"#id.class" and > - div with an id and class 指定id和样式的div元素
$(document).ready(function() {
$('#example').dataTable( {
"dom": '<"top"i>rt<"bottom"flp><"clear">'
} );
} );
DataTables DOM定位的更多相关文章
- Jquery.Datatables dom表格定位
Datatables会添加一些控制元素在表格的周围,比如默认状态下改变每页显示条数(l)的空间在左上角,即使搜索框(f)在右上角,表格的信息(i)显示在左下角,分页控件(p)显示在右下角. 这些控件在 ...
- Jquery.Datatables dom表格定位 (转)
Datatables会添加一些控制元素在表格的周围,比如默认状态下改变每页显示条数(l)的空间在左上角,即使搜索框(f)在右上角,表格的信息(i)显示在左下角,分页控件(p)显示在右下角. 这些控件在 ...
- JQuery Datatables Dom 和 Language 参数详细说明
http://linleizi.iteye.com/blog/2086435 *********************************** Data Tables: http://datat ...
- H5小技巧之——巧用<a>标签锚链接(#锚点链接 #页面特定位置 #DOM定位 #hash路由中使用锚链接)
#作者:矩阵鱼--代码中游泳的咸鱼 前端开发中,常遇到定位到页面某特定位置的需求,JavaScript提供的el.scrollIntoView() 和 el.scrollIntoViewIfNeede ...
- dom定位的三种元素
1.通过id #XXX 2.通过标签 xxx 3.通过类 .xxx
- Datatables快速入门开发--一款好用的JQuery表格插件
博主是一个java后端程序员小白,前端技术会用但不精通,做后台的一些功能经常要涉及表格的展示,分页,搜索,排序等等一系列功能,在经历了一段时间的原始手段,开始接触并使用Datatables,一个jqu ...
- vue+vux页面滚动定位(支持上下滑动)
接上篇文章:https://www.cnblogs.com/ligulalei/p/10622778.html在上篇文章中实现了通过使用scrollIntoView()在使用vux的移动端实现了点击锚 ...
- Angular使用总结 --- 如何正确的操作DOM
无奈接手了一个旧项目,上一个老哥在Angular项目中大量使用了JQuery来操作DOM,真的是太不讲究了.那么如何优雅的使用Angular的方式来操作DOM呢? 获取元素 1.ElementRef ...
- selenium元素定位(Java)
1.使用findElement方法定位元素 findElement()方法:当开始寻找符合指定条件的元素时,它将查询整个DOM,然后返回第一个找到的匹配元素. By id:通过元素ID属性定位 ...
随机推荐
- BZOJ 1018 [SHOI2008]堵塞的交通traffic
1018: [SHOI2008]堵塞的交通traffic Time Limit: 3 Sec Memory Limit: 162 MBSubmit: 2247 Solved: 706[Submit ...
- 【转】Android开发工具--android-studio-bundle-141.2288178
原文网址:http://www.androiddevtools.cn/ AndroidDevTools简介 Android Dev Tools官网地址:www.androiddevtools.cn 收 ...
- DLL模块:C++在VS下创建、调用dll
1.dll的优点 代码复用是提高软件开发效率的重要途径.一般而言,只要某部分代码具有通用性,就可将它构造成相对独立的功能模块并在之后的项目中重复使用.比较常见的例子是各种应用程序框架,ATL.MFC等 ...
- 移动web app开发框架
文章地址:http://www.cnblogs.com/soulaz/p/5586787.html jQuery Mobile jQuery Mobile框架能够帮助你快速开发出支持多种移动设备的Mo ...
- [LeetCode] 230. Kth Smallest Element in a BST 解题思路
Given a binary search tree, write a function kthSmallest to find the kth smallest element in it. Not ...
- powerdesigner 字段大小写转换\id 自增
转换:tools --> model options-->naming convention name code 自增: 在你所要设为自增型的键上(比如你的id)双击 ,弹出一个Colu ...
- 在Spring中使用异步事件实现同步事务
结合Scala+Spring,我们将采取一个很简单的场景:下订单,然后发送一封电子邮件. 编制一个服务: @Serviceclass OrderService @Autowired() (orderD ...
- C++编程规范之18:尽可能局部地声明变量
摘要: 避免作用域膨胀,对于需求如此,对于变量也是如此.变量将引入状态,而我们应该尽可能少地处理状态,变量的生存期也是越短越好. 变量的生存期超过必需的长度时会产生以下几个缺点: 1. 它们 ...
- 最小公约数(欧几里得算法&&stein算法)
求最小公约数,最easy想到的是欧几里得算法,这个算法也是比較easy理解的,效率也是非常不错的. 也叫做辗转相除法. 对随意两个数a.b(a>b).d=gcd(a.b),假设b不为零.那么gc ...
- Android应用程序中Activity的生命周期
Android应用程序中Activity的生命周期 对于Android来说Activity的生命周期是非常的重要,尤其是对于新学者来说,只有充分了解了Activity的生命周期,才能写出优良用户体验的 ...