在 xhtml 中，我想突出显示属性“ind”具有相同值的两个自闭合标签 s1 和 s2 之间的文本。例如。 <s1 ind="1"/>和 <s2 ind="1" />
例如。
<html>
<body>
<a>
<b>Some <s1 ind="1"/> text></b>
<c>data <s2 ind="1"/>here</c>
</a>
</body>
</html>
我希望突出显示“文本数据”。是否可以使用 Javascript/jQuery 来实现？我可以有许多这样的自闭合标签对 s1 和 s2，它们具有唯一的“ind”值，表示其中的文本需要突出显示。
最佳答案
在 (X)HTML 中没有“自定义标签”这样的东西。你不能只是编造标签。它们可能在某些浏览器中工作，但它不是您应该依赖的东西。使用“正常”标签，例如 div和 span上课。
编辑: 好的，我想我现在得到了你想要的。但是，您仍然不能使用自定义元素或自关闭元素 - 特别是如果您需要支持 IE，因为它都不支持。您需要改用空元素，例如:
<html><body><a><b>Some <span id="s1-1"></span> text></b> <c>data <span id="s2-1"></span>here</c> </a></body></html>
然后您需要做的是遍历以<span id="s1-1"></span> 开头的文档树。并以 <span id="s2-1"></span> 结尾并用 span “包装”在途中找到的所有文本节点s 和一个可用于突出显示的类。
类似这样的事情(未经测试，从我的头顶开始，很可能是错误的，因为我累了):
function wrapUntil(element, nr) {
if (element.id === "s2-" + nr)
return;
if (element.nodeType === 3) {
var span = document.createElement("span");
span.className = "highlight-" + nr;
element.parentNode.replaceChild(span, element);
span.appendChild(element);
element = span;
} else {
var child = element.firstChild;
if (child) {
wrapUntil(child, nr);
}
}
var sibling = element.nextSibling();
if (sibling)
wrapUntil(sibling, nr);
else
wrapUntil(element.parentNode(), nr);
}
wrapUntil(document.getElementById("s1-1"), "1");
顺便说一句，这取决于您获取数据的位置和方式，这可能是您应该在服务器端而不是使用 JavaScript 执行的操作。
关于javascript - 突出显示自定义标签之间的文本，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/2676462/