dojo 如何在“onclick”事件期间加载外部Javascript文件?

gr8qqesn  于 2022-12-08  发布在  Dojo
关注(0)|答案(5)|浏览(207)

我的HTML中有2个div。

<div id="div1"></div>
<div id="div2"></div>

在单击“div2”时,我想加载一个外部JavaScript文件,例如“https://abcapis.com/sample.js“。
我尝试在onclick事件中包含JS文件,如下所示,

var script = document.createElement("script");
script.type = "text/javascript";
script.src = "https://abcapis.com/sample.js"; 
document.getElementsByTagName("head")[0].appendChild(script);

这包括了head部分中的script标记,但没有加载,因为script标记将仅在页面加载时加载(如果我错了,请在此处纠正我)。
我还有别的办法吗?
提前致谢。

oxf4rvwz

oxf4rvwz1#

使用jQuery的$.getScript()函数应该可以完成这项工作。
下面是一段示例代码:

$("button").click(function(){
  $.getScript("demo_ajax_script.js");
});

如果您没有使用jQuery,那么您必须学习如何使用 AJAX 将新脚本动态加载到页面中。

uklbhaso

uklbhaso2#

您的代码几乎可以工作。您需要使用.setAttribute。以下是我的工作代码。我使用jQuery作为我的脚本:

var script = document.createElement('script');
script.setAttribute('type', 'text/javascript');
script.setAttribute('src', 'jquery.min.js');
document.head.appendChild(script);

这样就行了
编辑:
更多信息。当您执行类似script.type = 'text/javascript'的操作时,您是在对象上设置一个属性,但这不一定与将该属性与实际节点属性关联是同一回事。

2izufjch

2izufjch3#

您使用的是jQuery吗?如果是,您可以尝试$.getScript()
您可能还想检查answer。但基本上,您可以执行以下操作:

<a href='linkhref.html' 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 = "Public/Scripts/filename.js."; 
        document.getElementsByTagName("head")[0].appendChild(script);
        return false;
    }
</script>
zaq34kh6

zaq34kh64#

$("button").click(function(){
  $.getScript("demo_ajax_script.js");
});

我错过的一个信息是,路径必须是绝对的。

ctehm74n

ctehm74n5#

将此函数复制并粘贴到代码中。

<script type="text/javascript">
 getScript=(url)=>{
     var script = document.createElement('script');
     script.setAttribute('type', 'text/javascript');
     script.setAttribute('src', url);
     if(document.body == null){
         document.head.appendChild(script);
     }else{
         document.body.appendChild(script);
     }
 }
</script>

现在用你的.js文件url调用这个函数。getScript('https://abcapis.com/sample.js');
简介:

  • 文件不应包含DOMContentLoaded$(document).ready()函数

相关问题