對于通過 createHTMLDocument 構建的物件，我在使用 getElementsByClassName 時遇到問題。在嘗試 createHTMLDocument 之前，我有 createElement('div') 并且這作業正常，但在 createHTMLDocument 時并非如此
setTimeout(function() {
console.log('Starting...');
//var copy = document.createElement('div');
var copy = document.implementation.createHTMLDocument('virtual');
copy.innerHTML = document.getElementById('test').innerHTML;
//console.log(copy.innerHTML);
var r = copy.getElementsByClassName('removeOnSave');
console.log('seen ' r.length);
for (var i = r.length - 1; i >= 0; i--) r[i].parentNode.removeChild(r[i]);
var contentsTx = copy.innerHTML;
document.getElementById('output').value = contentsTx;
}, 1000);<h3>Load HTML from some content while trying not to trigger network calls</h3>
<div id="test">
Lorem ipsum
<img src="https://cdn.speakerscorner.co.uk/files/media/public/image/richard-ayoade-xsq.jpg">
Lorem ipsum <div class="removeOnSave">REMOVE ME</div>
</div>
<textarea id="output" style="width:100%; height:200px"></textarea>（JSFiddle 演示器也可在https://jsfiddle.net/Abeeee/deg3846s/10/ 上獲得）
我哪里錯了？
uj5u.com熱心網友回復：
問題是您innerHTML在新創建的檔案 ie 的正文中設定了copy.body.innerHTML = document.getElementById('test').innerHTML;. 我想你自己可以解釋為什么，所以我不會詳細解釋。
setTimeout(function() {
console.log('Starting...');
//var copy = document.createElement('div');
var copy = document.implementation.createHTMLDocument('virtual');
copy.body.innerHTML = document.getElementById('test').innerHTML;
//console.log(copy.innerHTML);
var r = copy.getElementsByClassName('removeOnSave');
console.log('seen ' r.length);
for (var i = r.length - 1; i >= 0; i--) r[i].parentNode.removeChild(r[i]);
var contentsTx = copy.body.innerHTML;
console.log('contentsTx=',contentsTx );
document.getElementById('output').value = contentsTx;
}, 1000);<h3>Load HTML from some content while trying not to trigger network calls</h3>
<div id="test">
Lorem ipsum
<img src="https://cdn.speakerscorner.co.uk/files/media/public/image/richard-ayoade-xsq.jpg">
Lorem ipsum <div class="removeOnSave">REMOVE ME</div>
</div>
<textarea id="output" style="width:100%; height:200px"></textarea>轉載請註明出處，本文鏈接：https://www.uj5u.com/caozuo/331382.html
標籤：javascript dom