JS 将内容添加到脚本标签 - Javascript

简介

在 JavaScript 中，我们可以通过动态创建和添加脚本标签来将内容添加到页面中。这种方法通常用于动态加载外部脚本或在页面中插入内联脚本。

实现

以下是使用 JavaScript 将内容添加到脚本标签的几种常见方法：

方法一：创建脚本元素并设置其内容

// 创建一个新的脚本元素
var script = document.createElement("script");

// 设置脚本内容
script.innerHTML = "console.log('Hello, World!');";

// 将脚本元素添加到页面的 head 或 body 元素中
document.head.appendChild(script);

这种方法会将脚本内容添加为内联脚本，并在添加到页面后立即执行。

方法二：创建脚本元素并设置其 src 属性

// 创建一个新的脚本元素
var script = document.createElement("script");

// 设置脚本的外部文件 URL
script.src = "path/to/script.js";

// 将脚本元素添加到页面的 head 或 body 元素中
document.head.appendChild(script);

这种方法用于动态加载外部脚本文件。脚本文件将在添加到页面后异步加载和执行。

方法三：使用 document.write() 方法

// 使用 document.write() 方法将脚本内容输出到文档中
document.write("<script src='path/to/script.js'></" + "script>");

这种方法是一种较早的技术，将脚本内容直接输出到文档中。但需要注意，使用这种方法时，脚本必须在页面加载期间立即执行，并且只能在页面加载期间使用。

总结

以上是在 JavaScript 中将内容添加到脚本标签的几种常见方法。这些方法可用于动态加载外部脚本或插入内联脚本，根据具体需求选择合适的方法即可。

请注意，动态加载脚本可能会导致一些安全问题，请确保加载的脚本可信，并且遵循最佳安全实践。