当我使用创建脚本元素document.createElement并将其附加到时document.head,JavaScript 成功执行:
var el = document.createElement('script');
el.text = "console.log('Hello World!')";
document.head.insertAdjacentElement('afterbegin', el);
// console output: "Hello World!"Run Code Online (Sandbox Code Playgroud)
但是如果我使用 DOMParser 解析 html 字符串然后将其附加firstElementChild到document.head,则 JavaScript 不会执行:
var parser = new DOMParser();
var htmlString = "<script>console.log('Bye World!')<\/script>";
var domEl = parser.parseFromString(htmlString, "text/xml").firstElementChild;
document.head.insertAdjacentElement('afterbegin', domEl);
// No console outputRun Code Online (Sandbox Code Playgroud)
在这两种情况下<script>都会添加一个标签。document.head为什么在第二种情况下 JavaScript 不执行?
我对这个问题基本上有相反的问题:如何在注入DOM时阻止iframe加载?
我希望加载一个IFRAME未注入DOM 的元素.
我试图通过javascript打印页面.目标是避免导航链接,发出打印命令和导航回来.
我有jQuery可供我使用.
// fake table that illustrates pertanent DOM
<table class=diary><tr><td data-job=12345 contextmenu=job_menu><a href=/jobs/12345>view job 12345</a></table>
// real code
<menu type="context" id="job_menu">
<menuitem label="Print Job" onclick="PrintJob(); return false;"></menuitem>
</menu>
<script type="text/javascript">
var target = null;
function PrintJob()
{
var job_no = $(target).data('job');
if(job_no > 0) {
$('<iframe name="printjob" src="/jobs/'+job_no+'">').load(function () {
this.focus();
this.print();
})
.trigger('load');
}
}
$('.diary').bind('contextmenu', function (ev) {
var td = ev.target;
while(td && td.nodeName != 'TD')
td = td.parentNode;
target …Run Code Online (Sandbox Code Playgroud) 我试图通过DOMParser将字符串解析为完整的HTML文档,然后用处理过的节点覆盖当前页面.该字符串包含完整的标记,包括<!doctype>,<html>,<head>和<body>节点.
// parse the string into a DOMDocument element:
var parser = new DOMParser();
var doc = parser.parseFromString(data, 'text/html');
// set the parsed head/body innerHTML contents into the current page's innerHTML
document.getElementsByTagName('head')[0].innerHTML = doc.getElementsByTagName('head')[0].innerHTML;
document.getElementsByTagName('body')[0].innerHTML = doc.getElementsByTagName('body')[0].innerHTML;
Run Code Online (Sandbox Code Playgroud)
这是因为它成功地获取了已解析的HTML节点并在页面上呈现它们; 但是,解析后的字符串中<script>的<head>或<body>节点中存在的任何标记都无法执行= [.直接使用html标签进行测试(与head/ 相反body)会产生相同的结果.
我也尝试过使用.appendChild()而不是.innerHTML()改变:
var elementHtml = document.getElementsByTagName('html')[0];
// remove the existing head/body nodes from the page
while …Run Code Online (Sandbox Code Playgroud)