绑定数据的顺序
最后更新于：2022-04-01 20:04:55
data() 函数有两个参数，第一个是被绑定数据，第二个参数用于指定绑定的顺序。在数据需要更新的时候常常会用到。
默认的情况下，data()函数是按照索引号依次绑定数组各项的。第0个元素绑定数组的第0项，第1个元素绑定数组的第1项，依此类推。也可以不按照此顺序进行绑定，这就要用到data()的第二个参数。这个参数是一个函数，称为键函数（key function）。
要注意，只有在选择集原来已经绑定有数据的情况下，才能使用键函数指定绑定的顺序。请看以下代码：
~~~
~~~
这段代码对p元素的内容进行了修改，修改之后的p元素为：
~~~
';
3 : 张三
6 : 李四
9 : 王五
~~~ 下面将persons里的数据更新，再绑定一次数据。本次绑定添加键函数： ~~~ //更新persons里的数据 persons = [ { id: 6 , name:"张三" }, { id: 9 , name:"李四" }, { id: 3 , name:"王五" }]; //根据键函数的规则绑定数据，并修改内容 p.data(persons, function(d){ return d.id; }) .text(function(d){ return d.id + " : " + d.name; }); ~~~ 键函数里只有一个语句return d.id。表示使用数组项的id属性作为**键**。使用本次绑定的数据修改p元素的内容后，结果如下： ~~~3 : 王五
6 : 张三
9 : 李四
~~~ 可以看到，结果并没有按照新persons数组的次序（6：张三、9：李四、3：王五）排列。绑定过程如图1所示，绑定的顺序不按照索引号绑定，而是使**键**值依次对应。 [](http://www.ourd3js.com/wordpress/wp-content/uploads/2015/01/4-4-121.png) 图1 谢谢阅读。 ### 文档信息 - 版权声明：署名（BY）-非商业性（NC）-禁止演绎（ND） - 发表日期：2015 年 1 月 17 日 - 更多内容：[OUR D3.JS - 数据可视化专题站](http://www.ourd3js.com/) 和 [CSDN个人博客](http://blog.csdn.net/lzhlzz) - 备注：本文发表于 [OUR D3.JS](http://www.ourd3js.com/) ，转载请注明出处，谢谢