我尝试在<div>上使用innerHTML加载一些脚本到页面中。脚本似乎加载到DOM中，但它从未执行(至少在Firefox和Chrome中)。有一种方法让脚本执行时插入他们与innerHTML?
示例代码:
<！DOCTYPE html > < html > <身体onload = " . getelementbyid(机)。innerHTML = '<script>alert(\'hi\')<\/script>'"> 难道不应该出现“hi”的提醒吗? < div id = "装载机" > < / div > 身体< / > < / html >
当前回答
下面是一个递归地将所有脚本替换为可执行脚本的方法:
function nodeScriptReplace(node) {
if ( nodeScriptIs(node) === true ) {
node.parentNode.replaceChild( nodeScriptClone(node) , node );
}
else {
var i = -1, children = node.childNodes;
while ( ++i < children.length ) {
nodeScriptReplace( children[i] );
}
}
return node;
}
function nodeScriptClone(node){
var script = document.createElement("script");
script.text = node.innerHTML;
var i = -1, attrs = node.attributes, attr;
while ( ++i < attrs.length ) {
script.setAttribute( (attr = attrs[i]).name, attr.value );
}
return script;
}
function nodeScriptIs(node) {
return node.tagName === 'SCRIPT';
}
示例调用:
nodeScriptReplace(document.getElementsByTagName("body")[0]);
其他回答
对我来说，最好的方法是通过innerHtml插入新的HTML内容，然后使用
setTimeout(() => {
var script_el = document.createElement("script")
script_el.src = 'script-to-add.js'
document.body.appendChild(script_el)
}, 500)
setTimeout不是必需的，但它工作得更好。这对我很管用。
过滤脚本标记，并使用eval运行每个标记
var tmp= document.createElement('div');
tmp.innerHTML = '<script>alert("hello")></script>';
[...tmp.children].filter(x => x.nodeName === 'SCRIPT').forEach(x => eval(x.innerText));
您可以创建脚本，然后注入内容。
var g = document.createElement('script');
var s = document.getElementsByTagName('script')[0];
g.text = "alert(\"hi\");"
s.parentNode.insertBefore(g, s);
这适用于所有浏览器:)
从innerHTML执行(Java Script)标签
将脚本元素替换为具有class="javascript"类属性的div，并以</div>关闭
不要改变你想要执行的内容(以前是在script标签，现在是在div标签)
在你的页面中添加一个样式…
<style type="text/css"> .javascript {display: none;} > < /风格
现在使用jquery运行eval (jquery js应该已经包含在内)
$('.javascript').each(function() {
eval($(this).text());
});`
你可以在我的博客上探索更多。
下面是一个递归地将所有脚本替换为可执行脚本的方法:
function nodeScriptReplace(node) {
if ( nodeScriptIs(node) === true ) {
node.parentNode.replaceChild( nodeScriptClone(node) , node );
}
else {
var i = -1, children = node.childNodes;
while ( ++i < children.length ) {
nodeScriptReplace( children[i] );
}
}
return node;
}
function nodeScriptClone(node){
var script = document.createElement("script");
script.text = node.innerHTML;
var i = -1, attrs = node.attributes, attr;
while ( ++i < attrs.length ) {
script.setAttribute( (attr = attrs[i]).name, attr.value );
}
return script;
}
function nodeScriptIs(node) {
return node.tagName === 'SCRIPT';
}
示例调用:
nodeScriptReplace(document.getElementsByTagName("body")[0]);
