为div元素添加重要的自定义信息，我该用id,class,name还是其它？_html/css

为div元素添加重要的自定义信息，我该用id,class,name还是其它？_html/css_WEB-ITnose

WBOY

发布： 2016-06-24 11:39:37

原创

1177 人浏览过

举个例子，一个web商场的用户购物车里有50项道具，每个道具是一个div，需要把道具id作为一个重要的自定义信息添加到每个div元素的属性里（以方便jquery随时捕捉），比如这个属性的值是item-123456，那么我应该把id,class还是name定义为item-123456？还是有别的更好的办法？
补充1：不会为同一个元素添加超过1条类似的自定义信息，因为所谓自定义信息，主要就是web应用中某个概念的id
补充2：假定可能出现两个id相同的道具分开作为2个商品的情况，而不是堆叠起来用1个div显示

1.如果用id，会导致有重复id；而且，id只能有一个，在一些实际例子中可能会需要对已存在id的元素添加这条自定义信息，就没办法添加了
2.如果用class，道具div本身可能就存在数个class属性，如‘item’,'selected'等等，如果再加入‘item-123456’，似乎目前的js+jquery并不方便获取道具的id值（即123456）
3.如果用name，不清楚是否安全稳定，总感觉name是input专享属性
4.或者有其它更好的解决办法

求各位大神指教，感谢！

回复讨论(解决方案)

用属性、data-

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>Document</title></head><body>        <div id="item_1" itemId="item-123456"></div>    <script>        // 给标签设置自定义属性        // 参考 JavaScript权威指南_122_第15章_脚本化文档_15.4-属性-获取和设置非标准HTML属性         // http://blog.csdn.net/wuqinfei_cs/article/details/46753659        var item_1 = document.getElementById( "item_1" );        console.info( item_1.getAttribute( "itemId" ) );    </script>    <div id="item_2" data-item-id="item-123456"></div>    <script>        // HTML5 的 data-* 自定义属性        // 参考 JavaScript权威指南_123_第15章_脚本化文档_15.4-属性-数据集属性        // http://blog.csdn.net/wuqinfei_cs/article/details/46753693        var item_2 = document.getElementById( "item_2" );        console.info( item_2.dataset.itemId );    </script></body></html>

登录后复制