JavaScript动态注入script节点最常用方式是创建元素、设属性（src或textContent）、再插入head或body；外部脚本需监听load/error事件，内联脚本插入即执行。
在 JavaScript 中动态注入新的 <script> 节点，最常用且可靠的方式是创建 script 元素、设置其属性（如 src 或内联代码），再插入到文档中（通常加到 <head> 或 <body> 末尾）。
注入外部 JS 文件
适用于加载 CDN 脚本或远程模块：
- 用
document.createElement('script')创建元素 - 设置
src属性指向目标 URL - 可选：设置
async或defer控制执行时机 - 调用
document.head.appendChild()或document.body.appendChild()插入
const script = document.createElement('script');
script.src = 'https://cdn.jsdelivr.net/npm/dayjs@1/dayjs.min.js';
script.async = true; // 非阻塞加载，加载完立即执行
document.head.appendChild(script);
注入内联 JavaScript 代码
适合运行小段逻辑、初始化脚本或调试代码：
Alibabacloud Sdk Client Initialization For Java
下载
在 Java 中初始化和管理阿里云 SDK客户端。包括单例模式、线程安全、endpoint 与 region 配置、VPC 终端节点、同步与异步等。
- 创建 script 元素后，用
textContent或appendChild(document.createTextNode(...))写入代码 - 注意：不能用
innerHTML，script 标签内容不解析 HTML - 插入后会立即执行（除非在 head 中且未设
defer）
const script = document.createElement('script');
script.textContent = 'console.log("Hello from injected script!"); alert("Loaded!");';
document.head.appendChild(script);
确保脚本执行完成后再操作
若依赖注入脚本的全局变量或函数，需监听加载完成事件：
立即学习“Java免费学习笔记（深入）”；
- 对
src脚本：监听load（成功）和error（失败）事件 - 避免在
appendChild后立刻调用新脚本定义的函数，可能尚未执行完毕 - 内联脚本无需等待，插入即执行（同步）
const script = document.createElement('script');
script.src = '/path/to/module.js';
script.onload = () => console.log('Script loaded');
script.onerror = () => console.error('Failed to load script');
document.head.appendChild(script);
避免重复注入
多次执行同一注入逻辑可能导致脚本重复加载或执行：
- 可通过给 script 添加自定义
id或data-*属性标记 - 插入前先查询是否已存在：
document.querySelector('script[data-id="my-sdk"]') - 也可检查全局变量是否存在（如
if (typeof myLib !== 'undefined') return）
