Question

我有一个这样的弹出列表：

<ol>
 <li>Point 1</li>
 <li>Point 2</li>
 <li>Point 3 has sub-points
  <ul>
   <li>Sub-point about something</li>
   <li>Sub-point about something else</li>
  </ul>
 </li>
</ol>

我从一个写脚本音译到另一个写脚本，所以我必须针对每个标签中的文本运行一些东西。这是我的jQuery的样子：

$("li").each(function() {
 text = dev2latin($(this).text());
}

它看起来像这样：

第1点
第2点
第3点有关于某事的子点关于其他事情的分论点

我已经尝试了几次jQuery选择器迭代，包括ol>li等，但是没有一个能够提供所需的结果。想法？

Answer 1

您可以使用.contents()获取文本节点，然后您可以.filter()它们并执行所需的操作。

$(document).ready(function() {
    $("li")
        .contents()
        .filter(function() {
            return this.nodeType == 3;
        }) //Filter text nodes
        .each(function() {
            this.nodeValue = dev2latin(this.nodeValue); //You can also textContent
        });
});

以下是一个例子：

＆＃13;

$(document).ready(function() {
    $("li").contents().filter(function() {
        return this.nodeType == 3;
    }).each(function() {
        this.textContent = this.textContent + 'Updated';
    });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ol>
  <li>Point 1</li>
  <li>Point 2</li>
  <li>Point 3 has sub-points
    <ul>
      <li>Sub-point about something</li>
      <li>Sub-point about something else</li>
    </ul>
  </li>
</ol>

＆＃13;

Answer 2

问题是在父li中调用.text（）将返回子li的文本内容

$("li").contents().each(function () {
    if (this.nodeType == 3 && this.nodeValue.trim()) {
        this.nodeValue = dev2latin(this.nodeValue)
    }
})

演示：Fiddle

Answer 3

$（＆＃39; ol＆gt; li＆＃39;）。each（function（）{console.log（$（this）[0] .childNodes [0]）;}）;

$（＆＃39; ul＆gt; li＆＃39;）。each（function（）{console.log（$（this）[0] .childNodes [0]）;}）;

试试这种方式。

Javascript代理子弹列表

3 个答案: