外部源提供以字串形式撰寫為 HTML 的腳本標記的內容。我需要將這些腳本標簽添加到頭部。如果我這樣做，所有腳本標簽都會添加到 DOM 的 head 標簽中，但是實際上沒有加載任何源（devtools 網路選項卡）。
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
</head>
<body>
<script>
let sLoadThis = '<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/underscore@latest/underscore-umd-min.js">'
sLoadThis = sLoadThis "<" "/script>"
let oScript = $(sLoadThis).get(0);
document.head.appendChild(oScript);
</script>
</body>
</html>
如果我使用 jQuery 作為解釋器，然后使用 vanilla JS 插入腳本標簽，它會起作用：
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
</head>
<body>
<script>
let sLoadThis = '<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/underscore@latest/underscore-umd-min.js">'
sLoadThis = sLoadThis "<" "/script>"
let oScript = $(sLoadThis).get(0);
var vanillaScript = document.createElement('script')
vanillaScript .type = 'text/javascript'
vanillaScript .src = oScript.src
document.head.appendChild(vanillaScript )
</script>
</body>
</html>
我想了解為什么它在我的第一個示例中不起作用。
uj5u.com熱心網友回復：
第二個示例運行是因為您使用的是 dom 節點。這就是appendChild()作業原理。jQueryget()方法適用于現有的 dom 元素。你唯一擁有的是一個字串，它還不存在于你的 dom 中。請嘗試以下操作。
let script = $.parseHtml(sLoadThis);
console.log(script.get(0)); // should be a script dom node element
document.head.appendChild(script.get(0));
在vanilla JavaScript 中，它比 jQuery 更容易、更快，因為您不必使用依賴項。
const fragment = document.createRange().createContextualFragment(htmlStr);
document.head.appendChild(fragment);
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/363781.html
標籤：javascript html 查询
上一篇：使用AJAX計算WordPressPost視圖onClick
下一篇：jQuery查找每個專案