javascript - 突出显示自定义标签之间的文本-6ren

javascript - 突出显示自定义标签之间的文本

转载作者：行者123 更新时间：2023-11-30 18:54:27

24

4

在 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/

24

4

0

文章推荐： javascript - Extjs 缓存 JSON 请求

文章推荐： javascript - YUI uploader : automatically open browse dialog

文章推荐： c - C中的结构查找大于某个变量的元素

文章推荐： c# - 运行 C# exe 文件

c# - 有没有一种方法可以“标记”对象的属性，使它们在反射中“突出”？
有没有一种方法可以“标记”对象的属性，使它们在反射中“突出”？例如： class A { int aa, b; string s1, s2; public int AA

首页

博学

6Ren·AI

商城

javascript - 突出显示自定义标签之间的文本