如何在单击另一个元素时插入新的脚本元素答案

【问题标题】：How to insert a new script element on click to another element如何在单击另一个元素时插入新的脚本元素
【发布时间】：2013-04-24 02:06:03
【问题描述】：

我正在开发一个应用程序，其中一个小部件有一个按钮，该按钮通过启动 API 启动另外两个。 API 运行良好，但我无法让调用函数正常工作。当我刚刚声明 API 时，使用：

<script src="js/global.js"></script>

它运行良好，但在打开页面后立即启动。我需要它在单击按钮时启动。

我有以下代码：

<a href='' id='mylink'>click me</a>

<script type="text/javascript">
var myLink = document.getElementById('mylink');
myLink.onclick = function(){
var script = document.createElement("script");
script.type = "text/javascript";
script.src = "js/global.js."; 
return false;
alert('ping');
}

我设置了警报以查看进程停止工作的位置。 “回归”之前的一切似乎都在运行。我已经尝试过return true和return false，它没有任何区别。

【问题讨论】：

这不是正确的方法。相反，您应该更改“global.js”中的代码，以便将您要执行的操作封装在要从“click”事件处理程序调用的函数中。

标签： javascript onclick widget

【解决方案1】：

需要插入脚本，尝试追加到头部：

document.getElementsByTagName('head')[0].appendChild(script);

所以你可以这样做：

<script type="text/javascript">
 var myLink = document.getElementById('mylink');

 myLink.onclick = function(){
   var script = document.createElement("script");
   script.type = "text/javascript";
   script.src = "js/global.js."; 
   document.getElementsByTagName('head')[0].appendChild(script);
}

</script>

同样在 HTML 中尝试使用锚以外的其他东西，因为锚会尝试向您发送其他内容，下一个代码看起来像锚但是跨度：

<span style="cursor:pointer; text-decoration:underline" id='mylink'>click me</span>

【讨论】：

就跨度而言，我决定改用带有按钮的表单。我认为这对于赛事来说更可行。我最终只是复制了我试图运行的函数，并让它在点击时参与。
好的，请确保在表单中添加 onsubmit="return false" :)

【解决方案2】：

return 终止函数的执行。

您没有将script 元素添加到文档中。

document.body.appendChild(script);

【讨论】：