Question

我已经尝试了很多东西，但我无法让我的代码工作。我想在此代码中更改包含数字的范围的文本：

<li class="top">
  <div class="sec">
            <span>123</span>
            <span class="inner">Lorem</span>
    </div>
</li>

我的JavaScript / JQuery：

(function($) {
  $(document).ready(function() {
    $('li.top .sec').find('span').eq(0).text('cccc');
  });
})(jQuery);

我已经能够编写改变两个跨度的代码，而不是那个。

Answer 1

(function($) {
    $(document).ready(function() {
       $('li.top .sec').find('.inner').prev().text('cccc');
    });
})(jQuery);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<li class="top">
    <div class="sec">
        <span>123</span>
        <span class="inner">Lorem</span>
    </div>
</li>

.prev()方法在DOM树中搜索每个元素的前任，并从匹配元素构造一个新的jQuery对象。

该方法可选地接受可以传递给$（）函数的相同类型的选择器表达式。如果提供了选择器，则将通过测试它是否与选择器匹配来过滤前面的元素。

摘录自JQuery prev documentation

Answer 2

您的代码正文似乎可以起作用。

我刚尝试将此行插入文档中，如下所示：

 $('li.top .sec').find('span').eq(0).text('cccc');

请参阅http://jsbin.com/leyasiwexu/edit?html,js,output

那么，也许还有其他因素导致了这个问题？

＆＃13;

console.log($('li.top .sec').find('span').eq(0).text());
     $('li.top .sec').find('span').eq(0).text('cccc')
console.log('changed to: ' + $('li.top .sec').find('span').eq(0).text());

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<li class="top">
  <div class="sec">
            <span>123</span>
            <span class="inner">Lorem</span>
    </div>
</li>

＆＃13;

Answer 3

你可以试试这个：

$('li.top .sec').find('.inner').prev().text('cccc');

Answer 4

我还没有检查过HTML Specifications，但我认为将div嵌套在li内是不恰当的。我知道你可以用css解决表示不规则问题，但jQuery可能不允许这样做。就像我说的那样，我还没有得到证实。如果您必须在li内嵌套项目，请使用内嵌元素。 div 阻止

用jQuery更改第一个span的文本

4 个答案: