Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/403.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 从外部js脚本创建元素并插入html_Javascript_Dom - Fatal编程技术网

Javascript 从外部js脚本创建元素并插入html

Javascript 从外部js脚本创建元素并插入html,javascript,dom,Javascript,Dom,我正在尝试创建一个小部件。类似于GoogleAdSense的块,所以我需要从页面的不同位置调用相同的脚本。是否可以在外部js脚本中创建一个元素并将其插入到我调用脚本的位置 我这样做: <div><script type="text/javascript" src="loader.js"></div> <div><script type="text/javascript" src="loader.js"></div> 我有:

我正在尝试创建一个小部件。类似于GoogleAdSense的块,所以我需要从页面的不同位置调用相同的脚本。是否可以在外部js脚本中创建一个元素并将其插入到我调用脚本的位置

我这样做:

<div><script type="text/javascript" src="loader.js"></div>
<div><script type="text/javascript" src="loader.js"></div>
我有:

<div><script type="text/javascript" src="loader.js"></div>
<div><script type="text/javascript" src="loader.js"></div>
<div class="inner-div"></div>
<div class="inner-div"></div>

但我想得到这个结果:

<div>
    <script type="text/javascript" src="loader.js">
    <div class="inner-div"></div>
</div>
<div>
    <script type="text/javascript" src="loader.js">
    <div class="inner-div"></div>
</div>

我想我找到了解决办法。查找当前脚本标记:

<div>
<script type="text/javascript">
  var scripts = document.getElementsByTagName('script');
  var script = scripts[scripts.length - 1];
  loadScript('loader.js', function () {
    loader().init({script: script});
  });
</script>
</div>
然后在loader.js中:

init: function(args) {
...
var div = document.createElement('div');
div.setAttribute('class', 'inner-div');
args.script.parentNode.appendChild(div);
...
}
function loadScript(url, callback){

    var script = document.createElement("script")
    script.type = "text/javascript";

    if (script.readyState){  //IE
        script.onreadystatechange = function(){
            if (script.readyState == "loaded" ||
                    script.readyState == "complete"){
                script.onreadystatechange = null;
                callback();
            }
        };
    } else {  //Others
        script.onload = function(){
            callback();
        };
    }

    script.src = url;
    document.getElementsByTagName("head")[0].appendChild(script);
}
init: function(args) {
...
var div = document.createElement('div');
div.setAttribute('class', 'inner-div');
args.script.parentNode.appendChild(div);
...
}