Question

我正在尝试使用$('.container').text()从HTML中获取没有任何标记的所有文本。我没有获得明文，而是获得带有重复部分的文本。

这是我的HTML代码：

<div class="v highlighted" id="4">
    <span class="vn" id="4">4</span>
    <span class="p">Text-0</span><br>
    <span class="p">
        <span class="wj">
            Text-1
            <span class="w">Text-2</span>
            Text-3
        </span>
    </span><br>
</div>

<script>
    console.log($(".highlighted :not(.vn)").text());
</script>

在控制台中我看到了这个结果：

Text-0Text-1Text-2Text-3Text-1Text-2Text-3Text-2

有人知道它为什么会发生吗？

Answer 1

查看.highlighted :not(.vn)匹配的内容。

匹配：

Text-0
 
Text-1Text-2Text-3
Text-1Text-2Text-3
Text-2

由于您在另一个范围中包含的某个范围中包含一些文字，并且两者这些范围与选择器匹配，因此您将获得外部范围和的内容（相同）内跨的内容。

您可能希望在选择器中使用子组合子（>）而不是后代组合子（）。

.highlighted > :not(.vn)

Answer 2

它可以帮到你：

<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>

</head>
<body>

<div class="v highlighted" id="4">
<span class="vn" id="4">4</span>
<span class="p">Text-0</span>
<br>
<span class="p"><span class="wj">Text-1<span class="w">Text-2</span>Text-3</span></span>
<br>
</div>

<script>
$(function() {
    $(".highlighted span:not(.vn)").each(function(){
        console.log("--",$(this).text());
    });

});  
</script>
</body>
</html>

jQuery函数.text（）

2 个答案: