在将其放入DOM *之前,请从文档片段 *中删除所有节点。
-
01-10-2019 - |
题
我的目标是从文档片段中删除所有<[script]>节点,然后将片段插入DOM之前,然后将其删除。
我的片段是由这样创建的,看起来像这样:
range = document.createRange();
range.selectNode(document.getElementsByTagName("body").item(0));
documentFragment = range.cloneContents();
sasDom.insertBefore(documentFragment, credit);
document.body.appendChild(documentFragment);
我在另一篇文章中得到了良好的沃克建议,但意识到我问了错误的问题。我得到了有关范围的答案,但是我要问的是文档片段(或者有一种方法可以设置一系列片段?hrmmm)。沃克提供的是:
function actOnElementsInRange(range, func) {
function isContainedInRange(el, range) {
var elRange = range.cloneRange();
elRange.selectNode(el);
return range.compareBoundaryPoints(Range.START_TO_START, elRange) <= 0
&& range.compareBoundaryPoints(Range.END_TO_END, elRange) >= 0;
}
var rangeStartElement = range.startContainer;
if (rangeStartElement.nodeType == 3) {
rangeStartElement = rangeStartElement.parentNode;
}
var rangeEndElement = range.endContainer;
if (rangeEndElement.nodeType == 3) {
rangeEndElement = rangeEndElement.parentNode;
}
var isInRange = function(el) {
return (el === rangeStartElement || el === rangeEndElement ||
isContainedInRange(el, range))
? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_SKIP;
};
var container = range.commonAncestorContainer;
if (container.nodeType != 1) {
container = container.parentNode;
}
var walker = document.createTreeWalker(document,
NodeFilter.SHOW_ELEMENT, isInRange, false);
while (walker.nextNode()) {
func(walker.currentNode);
}
}
actOnElementsInRange(range, function(el) {
el.removeAttribute("id");
});
该沃克代码从以下部件中提起: 在一系列片段中删除节点中的所有ID属性
请 没有图书馆(即jQuery)。我想以原始的方式做到这一点。在此先感谢您的帮助
解决方案
最简单的聚集方式 <script>
节点是使用 getElementsByTagName
, ,但不幸的是,这并未实现 DocumentFragment
.
但是,您可以创建一个临时容器,并附加片段中的所有元素,然后通过并删除所有元素 <script>
元素,像这样:
var temp = document.createElement('div');
while (documentFragment.firstChild)
temp.appendChild(documentFragment.firstChild);
var scripts = temp.getElementsByTagName('script');
var length = scripts.length;
while (length--)
scripts[length].parentNode.removeChild(scripts[length]);
// Add elements back to fragment:
while (temp.firstChild)
documentFragment.appendChild(temp.firstChild);
其他提示
如果我错了,请纠正我,但是如果文档范围是真正的dom碎片,则应该能够做类似的事情:
var scripts = documentFragment.getElementsByTagName('script');
if (scripts.length){
for (var i=0, l = scripts.length;i<l;i++){
documentFragment.removeChild(scripts[i]);
}
}
对?
更正:您不能将getElementsbythame应用于文档范围,JP是正确的。但是,如果片段是一个(克隆的)节点支持getElementsbytagname,您可以是片段的孩子。几天前,这是我在较大脚本中使用的一些(工作)代码:
var fragment = d.createDocumentFragment(), f;
fragment.appendChild(document.createElement('div'));
fragment.firstChild.appendChild(zoeklijst.cloneNode(true));
f = fragment.firstChild;
return f.getElementsByTagName(getList); //<==
不隶属于 StackOverflow