如何执行动态加载的 JavaScript 块? [英] How do you execute a dynamically loaded JavaScript block?

查看:21
本文介绍了如何执行动态加载的 JavaScript 块?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在处理一个网页,我正在其中进行 AJAX 调用,该调用返回一大块 HTML,例如:

<!-- 一些 html --><script type="text/javascript">/** 一些 JavaScript */

我将整个内容插入到 DOM 中,但 JavaScript 并未运行.有没有办法运行它?

一些细节:我无法控制脚本块中的内容(因此我无法将其更改为可以调用的函数),我只需要执行整个块即可.我无法对响应调用 eval,因为 JavaScript 位于更大的 HTML 块中.我可以做某种正则表达式来分离 JavaScript,然后对它调用 eval,但这很糟糕.有人知道更好的方法吗?

解决方案

通过设置元素的 innerHTML 属性添加的脚本不会被执行.尝试创建一个新 div,设置其 innerHTML,然后将这个新 div 添加到 DOM.例如:

<前><头><script type='text/javascript'>函数 addScript(){var str = "<script>alert('我在这里');</script>";var newdiv = document.createElement('div');newdiv.innerHTML = str;document.getElementById('target').appendChild(newdiv);}<身体><输入类型=按钮"值=添加脚本"onclick="addScript()"/><div>你好世界</div><div id=目标"></div>

I'm working on a web page where I'm making an AJAX call that returns a chunk of HTML like:

<div>
  <!-- some html -->
  <script type="text/javascript">
    /** some javascript */
  </script>
</div>

I'm inserting the whole thing into the DOM, but the JavaScript isn't being run. Is there a way to run it?

Some details: I can't control what's in the script block (so I can't change it to a function that could be called), I just need the whole block to be executed. I can't call eval on the response because the JavaScript is within a larger block of HTML. I could do some kind of regex to separate out the JavaScript and then call eval on it, but that's pretty yucky. Anyone know a better way?

解决方案

Script added by setting the innerHTML property of an element doesn't get executed. Try creating a new div, setting its innerHTML, then adding this new div to the DOM. For example:

<html>
<head>
<script type='text/javascript'>
function addScript()
{
    var str = "<script>alert('i am here');</script>";
    var newdiv = document.createElement('div');
    newdiv.innerHTML = str;
    document.getElementById('target').appendChild(newdiv);
}
</script>
</head>
<body>
<input type="button" value="add script" onclick="addScript()"/>
<div>hello world</div>
<div id="target"></div>
</body>
</html>

这篇关于如何执行动态加载的 JavaScript 块?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆