使用javascript访问ul中的li元素

我试图建立一个程序，一旦页面加载，它会自动增加一个大小。 我在ul中有一堆li标签，我想知道如何使用JQuery准确地访问这些li标签

我通常使用Document.getByName，但ul没有id

以下是完整的代码：

<div class="exp-pdp-size-dropdown-container selectBox-options exp-pdp-size-dropdown exp-pdp-dropdown selectBox-dropdown-menu" style="display: block; top: 38px; left: 0px;">
<a class="selectBox exp-pdp-size-dropdown exp-pdp-dropdown selectBox-dropdown selectBox-menuShowing" style="display: inline-block;" title="" tabindex="0"><label class="exp-pdp-dropdown-label platform-font-1">SIZE</label><span class="selectBox-label">&nbsp;</span><span class="selectBox-arrow glyph-replace" data-glyph="j"></span></a>
<ul class="selectBox-options exp-pdp-size-dropdown exp-pdp-dropdown" style=""><li class="exp-pdp-size-not-in-stock selectBox-selected" style=""><a rel=""></a></li><li class="exp-pdp-size-not-in-stock first-in-row upper-left"><a rel="3488377:6">
           6
        </a></li><li class="exp-pdp-size-not-in-stock"><a rel="3488378:6.5">
           6.5
        </a></li><li class="last-in-row upper-right"><a rel="3488379:7">
           7
        </a></li><li class="first-in-row"><a rel="3488380:7.5">
           7.5
        </a></li><li class=""><a rel="3488381:8">
           8
        </a></li><li class="last-in-row"><a rel="3488382:8.5">
           8.5
        </a></li><li class="first-in-row"><a rel="3488383:9">
           9
        </a></li><li class="exp-pdp-size-not-in-stock"><a rel="3488384:9.5">
           9.5
        </a></li><li class="last-in-row"><a rel="3488385:10">
           10
        </a></li><li class="first-in-row"><a rel="3488386:10.5">
           10.5
        </a></li><li class=""><a rel="3488387:11">
           11
        </a></li><li class="last-in-row"><a rel="3488388:11.5">
           11.5
        </a></li><li class="first-in-row"><a rel="3488389:12">
           12
        </a></li><li class="exp-pdp-size-not-in-stock"><a rel="3488390:12.5">
           12.5
        </a></li><li class="last-in-row"><a rel="3488391:13">
           13
        </a></li><li class="first-in-row lower-left"><a rel="3488392:14">
           14
        </a></li><li class="exp-pdp-size-not-in-stock last-in-row lower-right"><a rel="3488393:15">
           15
        </a></li></ul></div>

大小

6.

6.5

7.

7.5

8.

8.5

9

9.5

10

10.5

11

11.5

12

12.5

13

14

15

您可以使用或

$('ul.selectBox-options').prepend('<li>Hello World</li>');
$('ul.selectBox-options').append('<li>Good bye World</li>');

---

首先，给您的

标签一个

id

，如下所示：

<ul id="myList" class="selectBox-options exp-pdp-size-dropdown exp-pdp-dropdown" style="">

var listItems = $('ul.selectBox-options li');

---

您可以使用appendChild：

JAVASCRIPT：

var ul = document.getElementById("test");
var addLi = document.createElement("li");
ul.appendChild(addLi);
addLi.innerHTML = "Second li";

演示：

---

Node.appendChild:

我用于获取ul标记的选择器是代码中的第一个类值，如果您只想将此选择器应用于一个ul标记，则必须向ul标记添加一个id attr，然后添加类似于/$（“#yourID li”）.size（）的内容

---

你试过使用类选择器吗？我不明白你的问题。

$（“li”）

有什么问题？@JasonP您能告诉我在这个例子中我会怎么做吗？@Bergi在这个上下文中我会如何使用$（“li”）-如果您想添加信息，请编辑帖子。有没有办法只访问类名而不添加ID谢谢！我如何将列表项设置为数组？如下：

$（'ul.selectBox-options li'）.toArray（）这里是我想做的更详细的例子这里是我想做的更详细的例子这里是我想做的更详细的例子
var listItems = $('ul.selectBox-options li');

var ul = document.getElementById("test");
var addLi = document.createElement("li");
ul.appendChild(addLi);
addLi.innerHTML = "Second li";

$(document).ready( function(){
    var count_Li = $('.selectBox-options li').size();
    alert(count_Li);

    $('.selectBox-options li').each( function(){
        alert($(this).text());
    });
});