Question

我动态加载了div id="example"的网页。因此，只会执行id的内容。我在div中也有脚本标签，没有被执行。我尝试过使用eval但它失败了。

<div id="example">
    <script>
        alert("Welcome");
    </script>
</div>

在js文件中，

var ele=document.getElementByTagName('script');
eval(ele.innerHTML);

附上下面的plunker链接 https://plnkr.co/edit/LrfxZERqI6gYhKbGvNwQ?p=preview

Answer 1

您可以等待元素的存在来运行脚本，它比在元素内部运行JS更好，更容易接受解决方案

if(document.querySelector('.my_selector')){
   doStuff();
}

如果要以动态方式添加元素，则可以执行所需的代码

document.body.append('<div class="my_selector></div>"');
doStuff();

如果它是异步的，你可以使用promises等待添加元素

let adding_element = new Promise((resolve, reject)=>{
  if(!document.querySelector('.my_selector')){
   setTimeOut(resolve('.my_selector'),1000);
}
});

adding_element.then(selector => {
  document.body.append(`<div class="${selector}"></div>"`);
  doStuff();
});

由于您正在等待用户点击例如<a class="my_selector" href="#something">link</a>，您可以添加一个事件监听器，它只会在用户点击该链接时运行

let link_element = document.querySelector('.my_selector');

function doSomething(){
  //some code
}

link_element.addEventListener('click', doSomething);

有更好的方法可以做到这一点，但请避免你现在正在做的事情。

在div中加载脚本标签

1 个答案: