用JavaScript创建链接,并将其集成到createTextNode()中

Creating link in JavaScript, and integrating it into createTextNode()

本文关键字:集成 createTextNode 创建 JavaScript 链接      更新时间:2023-09-26

我希望将链接集成到创建的文本节点中,但它只是文本(标题),而不是链接。我该如何解决这个问题?

函数中的代码:

function createMessage() {
   var a = document.createElement('a');
   var linkText = document.createTextNode("http://www.example.com");
   a.title = "http://www.example.com";
   a.href = "http://www.example.com";
   var message2 = document.createElement("p");
   var message2text = document.createTextNode("Website: " + a + ".");
   message2.appendChild(message2text);
   var olElem = document.getElementById("display");
   var old = document.getElementById("display");
   var display = old.parentNode;
   return display.replaceChild(message2, olElem);
}

此处的问题:

var message2text = document.createTextNode("Website: " + a + ".");
// ---------------------------------------------------^^^^^^^

您不能将DOM元素附加到字符串中并获得有用的结果。

很难弄清楚你想在代码中做什么,但要创建一个包含链接的段落,最简单的方法是innerHTML:

var p = document.createElement('p');
p.innerHTML = 'Website: <a href="http://example.com" title="http://example.com">http://example.com</a>.';

然后在需要的地方附加/插入。

但如果你想零零碎碎地做,那就是:

var a = document.createElement('a');
a.href = "http://example.com";
a.title = "http://example.com";
a.appendChild(document.createTextNode("http://example.com"));
var p = document.createElement('p');
p.appendChild(document.createTextNode("Website: "));
p.appendChild(a);
p.appendChild(document.createTextNode("."));

然后在需要的地方附加/插入。请注意,我们必须创建三个单独的文本节点:链接前的文本、链接内的文本和链接后的文本。