是否允许具有列表项的值

Is it allowed to have value for list item?

本文关键字：列表 许具 是否      更新时间：2023-09-26
 <ul id="my-list">
     <li value="1001">item1 </li>
     <li value="1002">item2 </li>
     <li value="1003">item3 </li>
     <li value="1004">item4 <li/>
 </ul>

是否允许列表项具有值？如果可以，如何使用javascript或jquery访问该值？

根据 W3C 元素LI规范，在某些情况下允许对LI使用value属性，但不能使用此属性。如果您使用的是 HTML5，请使用data-*属性：

<ul id="my-list>
   <li data-my-value="...">...</li>
   <li data-my-value="123">...</li>
   <li data-my-value="...">...</li>
</ul>

要使用jQuery获取对特定元素的引用，请使用以下选择器：

$("ul#my-list li[data-my-value='123']")...

或者，如果您已经引用了所有LI元素，请使用jQuery.filter()：

var $items = $listItems.filter(function() {
    retrun $(this).data("my-value") === "123";
});

您可以向节点添加任何类型的自定义数据属性(当然，HTML 不会验证，也不会是有效的 XHTML 文档(。然后，您可以使用jQuery attr((函数访问它们(例如(。

也就是说，这是一种

糟糕的做法，您应该使用标准的 data- 属性，例如可以通过 data(( 函数访问(更多详细信息和示例，请参阅提供的链接(：

var theValue = $("#yourItemId").data("value");

对于以下属性：

<li id="yourItemId" data-value="1001">item1</li>
为此，

我建议使用 jquery Data

<ul id="my-list">
 <li data-value="1001">item1 </li>
 <li data-value="1002">item2 </li>
 <li data-value="1003">item3 </li>
 <li data-value="1004">item4 <li/>
</ul>

获取第二里值

$("#my-list").children().eq(2).data("value");

如果要生成有效的 HTML5，则应坚持使用自定义属性的data属性：

<li data-value="1001">

但是，任何元素都可以具有自定义属性。事实上，自版本 5 以来，这一直是 IE 中的标准配置(有时称为 expando 属性(。

相关文章：