Question

我正在论坛网页上工作但不允许在网页中编辑HTML。我想隐藏文字直到徘徊。这是HTML代码的一个粗略示例：

<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>nextUntil demo</title>
    <script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
<dl>
    <dd class="postprofile-info">
        <span>
            <span>
                <img src="image here">
            </span>
        </span>
        "This is the text I want to surround in a div"
        <br>
        <span class="label"></span>
        "Text from here on out can be ignored"
        <br>
    </dd>
<dl>
</body>
</html>

我知道有.nextUntil（）和.wrapAll（）函数，但我无法让它正常工作。我遇到的另一个问题是比较标签和
标签之间的信息，以确保我只将我想要的文本包装在div中。我的目标是将该文本包装在div中，以便我可以给它一个类并使用css对其进行操作。

编辑1： 我没有提供任何JS的原因是因为我只测试了利用.nextUntil（）和.wrapAll（）的片段。这就是我所拥有的一切，它是点点滴滴：

（只是测试看看这是否有用）。

$( ".postprofile-info" ).nextUntil( "dt" ).css( "background-color", "red" );

（另一项测试）

$('form > span').each(function(){
    $(this).next('p').andSelf().wrapAll('<div class="test"/>');
});

（另一项测试）

var nodelist = document.getElementsByTagName("dd").length;
for (i = 0; i < nodelist-1; i++) {
    var TextDd = document.getElementsByTagName("dd")[i].innerHTML;
    if (TextDd === "For helping in the construction of the CGDT Forum"){
        $('form > span').each(function(){
            $(this).next('p').andSelf().wrapAll('<div class="test"/>');
        });
    }
}

Answer 1

使您不那么容易的事情是您正在尝试包装文本节点。哪个不是那么简单。但这样的事情可以解决问题：

＆＃13;

$('dl > dd').each(function(index){
    var textNode = $(this).contents().get(2).nodeValue;
    console.log(textNode);
    var newHtml = $(this).html().replace(textNode,'<div class="new">'+textNode+'</div>');
    $(this).html(newHtml);
});

＆＃13;

.new {
    border: solid 3px green;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<dl>
  <dd class="postprofile-info">
    <span>
        <span>
            <img src="image here">
        </span>
    </span>
    "This is the text I want to surround in a div"
    <br>
    <span class="label"></span>
    "Text from here on out can be ignored"
    <br>
  </dd>
</dl>

＆＃13;

注意：如果更改标记，这将无效，尤其是.get(2)的原因，因此文本节点必须完全位于该位置。

在两个HTML元素之间扫描文本并使用.wrapAll（）函数

1 个答案: