jquery - 为孩子添加课程

Question

当我这样做时， $('ul.latestnews ul li').parent().prev().text());我会取回目标 li 的内容。（本例中为 word1 或 word2）。

但是当我这样做时

$('ul.latestnews ul li').addClass($(this).parent().prev().text());

它不添加类。当我在最后一条语句上执行 console.log 时，它只返回我试图将类添加到的所有 li。

我想做的是：

<ul class="latestnews">
    <li>word1</li>
    <ul>
        <li>my class should become word1</li>
        <li>my class should become word1</li>
    </ul>
    <li>word2</li>
    <ul>
        <li>my class must become word2</li>
    </ul>        
</ul>

我哪里做错了？

Answer 1

this是仅在 jQuery 函数内部的 DOM 元素，例如each：

$('ul.latestnews ul li').each(function(){
    $(this).addClass($(this).parent().prev().text());
});

this您的代码中的Live DEMOWindow可能是对象...

请注意，如果您稍微更改 DOM 结构，这些 DOM 遍历很容易中断，您可能希望使用其他基于元素类的选择器prev。parent

Answer 2

我认为 html 代码不太正确，因为它应该是这样的：

<ul class="latestnews">
    <li>word1</li>
    <li>
        <ul>
            <li>my class should become word1</li>
            <li>my class should become word1</li>
        </ul>
    </li>
    <li>word2</li>
    <li>
        <ul>
            <li>my class must become word2</li>
        </ul>
    </li>        
</ul>

然后：

$("ul.latestnews ul > li").each(function(){
    var $this=$(this);
    var className = $this.parents("li").first().prev().text();
    $this.addClass(className);
});