非侵入性Javascript HTML注入

Non-invasive Javascript HTML injection

本文关键字：HTML 注入 Javascript      更新时间：2023-09-26

我正在寻找一种非侵入性的javascript HTML/CSS/JS页面注入。理想情况下，我希望使用document.write，但保留页面上的原始内容。因此，请执行以下操作：

javascript:document.write（"blablabla"）；-这会删除页面上的所有内容，我不想使用innerHTML+=来附加数据。

有什么建议吗？

如果在文档的onload事件之后调用document.write，它需要重新打开文档-有效地截断文档。虽然您可以显式地内联调用document.wwrite（）（使用直接嵌入页面中的javascript或不使用defer/async的标记），但这被认为是一种糟糕的做法，因为它会阻止页面的所有其他处理。

您可以通过在Javascript中构建元素来注入元素。我个人更喜欢将现有占位符的innerHTML设置为HTML片段：

<div id='placeholder/></div>
...
document.getElementById('placeholder').innerHTML="<h2>hello world!</h2>";

（创建/注入复杂HTML时，使用createElement会变得混乱和缓慢）

据我所知，

document.write将始终覆盖整个页面。一种选择是将代码附加到div或正文底部。

$(elementObj).append(contents);
//or
$(elementObj).prepend(contents);

您可以创建元素（），然后使用上面的方法之一将代码注入到新创建的元素中。

相关文章：