datatable -- dom位置确定和样式修改

参考 http://www.datatables.club/reference/option/dom.html

默认dom的取值为 lrtip ，可以为dom添加其他元素， 或修改位置， 如上实例。

Datatables会添加一些控制元素在表格的周围，比如默认状态下改变每页显示条数（l）的空间在左上角，即使搜索框（f）在右上角，表格的信息（i）显示在左下角，分页控件（p）显示在右下角。 这些控件在给大家带来便利的同时，也可能出现困惑。比如我想把l放在i的后面，我想表格的上下都有p，我想加入自己的控件放在l的后面……这些太多了，那么下面就给大家介绍怎么去使用dom属性配置已经自定义。

上面我已经用了一些英文字母标注在每个控件的后面，开始看肯定会有些疑惑，或者不熟悉，不要着急，我来告诉大家这些到底是什么

作者为了适应我们所说的这些情况，已经考虑到了，所以有这么强大的dom属性。那么作者定义了如下字母：

这些字母你可以理解为一个标签，dt会自动把这些字母替换成相应的控件，就想模板一样。上面的这些元素 l、f、t、i、p、r除了t只能指定一次，其他的均可多次指定。

下面还有两个字母是应用到jQueryUI上的，不过作者推荐在1.10甚至1.11版本中不去使用他，通过使用 jQueryUIOption 来分离开

最后，你也可以添加插件给Datatables，指定新的字母。比如 TableTools 就是添加了 T 来表示。在dom里指定之后，相应的按钮就添加到表格上了

注意：dom的用法可能还不是很简单，希望在1.11版本的计划中更加优化这个参数的使用，让表格定位更简单

楼下说得太简单了，估计提问者看不懂。

假设，你有以下DOM

<div id="dvTest">

    <div>在这下面加一个按钮</div>

</div>

然后你添加一个按钮，方法如下

function addButton(){

    var $container = $("#dvTest")

    $container.append("<a href='javascript:'>click me</a>")

}

然后，给刚加的按钮一个click事件

//你要先找到你加的这个按钮

$("#dvTest > a").click(function(){ alert('you clicked me') })

//或

$("#dvTest > a").unbind().on('click'), function(){ alert('you clicked me') })

我觉得你主要是jQuery的筛选器用得不够熟。你可以搜一下，大概看看。只要能找到控件，绑定事件都不叫事儿。

---