Question

我从XSLT生成的HTML看起来像：

It's like what Sir Ian McKellan told me the day I sold my boat to Karl Lagerfeld: Parting is such sweet sorrow.

我正在尝试使用javascript来解析它，以便添加额外的标记来标记引号周围的上下文。目标是为用户提供是否显示报价加上下文或仅显示报价的选项。最终结果将是，例如，

It's like what Sir Ian McKellan told me the day I sold my boat to Karl Lagerfeld: Parting is such sweet sorrow.

这样，将preContext的style.display定义为none就很简单了。我尝试过使用insertAdjacentHTML;例如，

document.getElementById("text").insertAdjacentHTML('afterbegin', "<span id='preContext'>");
document.getElementById("quote").insertAdjacentHTML('beforebegin', "</span>");

但是，正如我发现的那样，insertAdjacentHTML可以插入节点但不能插入单个标签。上面的内容让我It's like. . .

这可以在javascript中使用，还是需要在XSLT中完成？（PS：我不想使用JQuery。）

Answer 1

工作示例：http://jsfiddle.net/vcSFR/1/

此代码获取第一个textNode，将其包装在span中，然后将原始的第一个文本节点交换为新的span。

var oDiv = document.getElementById("text");
var firstText = "";
for (var i = 0; i < oDiv.childNodes.length; i++) {
    var curNode = oDiv.childNodes[i];
    if (curNode.nodeName === "#text") {
        firstText = curNode.nodeValue;
        break;
    }
}
firstTextWrapped = '<span id="preContext">' + firstText + '</span>';
oDiv.innerHTML = oDiv.innerHTML.replace(firstText, firstTextWrapped);

感谢https://stackoverflow.com/a/6520270/940252代码获取第一个textNode。

使用javascript将标签添加到HTML

1 个答案: