javascript 为什么没有 document.createHTMLNode()?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/7545267/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Why isn't there a document.createHTMLNode()?
提问by Martin
I want to insert html at the current range (a W3C Range).
我想在当前范围(W3C 范围)插入 html。
I guess i have to use the method insertNode. And it works great with text.
我想我必须使用方法 insertNode。它适用于文本。
Example:
例子:
var node = document.createTextNode("some text");
range.insertNode(node);
The problem is that i want to insert html (might be something like "<h1>test</h1>some more text"). And there is no createHTMLNode().
问题是我想插入 html(可能类似于“<h1>test</h1>some more text”)。并且没有 createHTMLNode()。
I've tried to use createElement('div'), give it an id, and the html as innerHTML and then trying to replace it with it's nodeValue after inserting it but it gives me DOM Errors.
我尝试使用 createElement('div'),给它一个 id,然后将 html 作为innerHTML,然后在插入它后尝试用它的 nodeValue 替换它,但它给了我 DOM 错误。
Is there a way to do this without getting an extra html-element around the html i want to insert?
有没有办法做到这一点,而无需在我想要插入的 html 周围获得额外的 html 元素?
采纳答案by Quentin
Because "<h1>test</h1>some more text"
consists of an HTML element and two pieces of text. It isn't anode.
因为"<h1>test</h1>some more text"
由一个 HTML 元素和两段文本组成。它不是一个节点。
If you want to insert HTML then use innerHTML
.
如果要插入 HTML,请使用innerHTML
.
Is there a way to do this without getting an extra html-element around the html i want to insert?
有没有办法做到这一点,而无需在我想要插入的 html 周围获得额外的 html 元素?
Create an element (don't add it to the document). Set its innerHTML. Then move all its child nodes by looping over foo.childNodes
.
创建一个元素(不要将其添加到文档中)。设置其innerHTML。然后通过循环移动它的所有子节点foo.childNodes
。
回答by Tim Down
In some browsers (notably not any version of IE), Range
objects have an originally non-standard createContextualFragment()
that may help. It's likely that future versions of browsers such as IE will implement this now that it has been standardized.
在某些浏览器(尤其是 IE 的任何版本除外)中,Range
对象最初具有非标准的createContextualFragment()
可能会有所帮助。IE 等浏览器的未来版本很可能会实现这一点,因为它已经标准化了。
Here's an example:
下面是一个例子:
var frag = range.createContextualFragment("<h1>test</h1>some more text");
range.insertNode(frag);
回答by Tom
Try
尝试
function createHTMLNode(htmlCode, tooltip) {
// create html node
var htmlNode = document.createElement('span');
htmlNode.innerHTML = htmlCode
htmlNode.className = 'treehtml';
htmlNode.setAttribute('title', tooltip);
return htmlNode;
}
From: http://www.koders.com/javascript/fid21CDC3EB9772B0A50EA149866133F0269A1D37FA.aspx
来自:http: //www.koders.com/javascript/fid21CDC3EB9772B0A50EA149866133F0269A1D37FA.aspx
回答by Ramzi Khahil
回答by RafaSashi
The Range.insertNode() method inserts a node at the start of the Range.
Range.insertNode() 方法在 Range 的开头插入一个节点。
var range = window.getSelection().getRangeAt(0);
var node = document.createElement('b');
node.innerHTML = 'bold text';
range.insertNode(node);
Resources
资源
https://developer.mozilla.org/en-US/docs/Web/API/range/insertNode
https://developer.mozilla.org/en-US/docs/Web/API/range/insertNode