执行用 XMLHttpRequest 编写的包含脚本标签的 Javascript?
通过 Javascript 请求,XMLHttpRequest
使用一些需要添加到请求页面的附加 Javascript 进行响应。
使用 eval(),如果响应类似于:
alert('This is the js response');
... 那么这工作得很好。
然而,返回的文本可能看起来像这样:
<script language="javascript">var checkVar='checkVar: value 1';</script>
但最有可能的是:
<script src="http://www.somesite.com/setCheckVarValue.js"></script>
... 需要在页面上加载额外的 JS。
我已确保 XMLHttpRequest
是同步
,因为我想在此之后立即引用 checkVar。
因此:
<script type="text/javascript" src="http://www.mysite.com/addJSToPage.js" />
// at this point, since this is a synchronous call, page processing waits
// until the response is received that needs to include the additional JS
// to load; this, for testing sets the value of checkVar
<script type="text/javascript" >
alert(checkVar);
</script>
警报消息应为“checkVar:值 1”。
由于其他原因,这不仅仅是在 addJSToPaged.js
中设置 var checkVar 那么简单,所以我不寻找这种建议。
我使用 alert(checkVar) 只是作为测试,以确保已通过 JS 在响应中设置值。
我想我可以去掉开始和结束脚本标签并保留 eval()
的方式。但是,我想知道是否有任何解决方案支持我正在寻找的内容?
谢谢。
更新
按照 Prashanth 的建议,在 addJSToPage.js 中我添加了:
var dynamicElement = document.createElement('div');
然后在 XMLHttpRequest 的响应中,我做了:
dynamicElement.appendChild = xmlhttp.responseText;
仍然没有看到 checkVar 的值。
Through a Javascript request, XMLHttpRequest
responds with some additional Javascript that needs to be added to the page the requesting page.
Using eval(), if the response is something like:
alert('This is the js response');
... then this works just fine.
However, the text returned could look something like this:
<script language="javascript">var checkVar='checkVar: value 1';</script>
but most likely:
<script src="http://www.somesite.com/setCheckVarValue.js"></script>
... where additional JS needs to be loaded on the page.
I have ensured that the XMLHttpRequest
is synchronous
, as I want to reference checkVar right after this.
So:
<script type="text/javascript" src="http://www.mysite.com/addJSToPage.js" />
// at this point, since this is a synchronous call, page processing waits
// until the response is received that needs to include the additional JS
// to load; this, for testing sets the value of checkVar
<script type="text/javascript" >
alert(checkVar);
</script>
The alert message should read "checkVar: value 1".
For other reasons, this is not just as simple as setting var checkVar in addJSToPaged.js
, so I'm not looking for that kind of recommendation.
I'm using alert(checkVar) simply as a test to ensure that a value has been set through JS in the response.
I suppose that I could strip out the beginning and ending script tags and keep the eval()
way of doing it. However, I would like to know if there are any solutions that support what I'm looking for?
Thanks.
UPDATE
Following Prashanth's suggestion, in addJSToPage.js I added:
var dynamicElement = document.createElement('div');
Then in the response from the XMLHttpRequest, I did:
dynamicElement.appendChild = xmlhttp.responseText;
Still not seeing the value of checkVar.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(3)
忽略这样一个事实:无论你在做什么都可能是个坏主意,Prashanth 的正确想法是将其插入到 DOM 中。您还可以删除标签并评估为“正常”。
不要忽视这样一个事实:1)
eval
是邪恶的,2) 动态加载远程代码是不好的,3) 同步 AJAX 是特别糟糕的,我要说的是:除非你知道自己在做什么,<评估任何东西都是一个坏主意,它很难调试,可能会暴露大量的安全缺陷和各种其他令人讨厌的问题。然后,您可以通过加载远程代码来复合这一点,该代码显然是以您无法控制的方式生成的,因为您无法仅获取脚本。同步 Ajax 很糟糕,因为 javascript 中只有一个线程,Ajax 上的阻塞实际上会锁定整个页面,直到加载为止,因为即使像滚动这样的事情也会生成 javascript 事件,而当前繁忙的引擎必须处理这些事件检查处理程序。虽然请求在本地计算机上速度很快,但连接速度慢或质量差的人可能会等待一段时间,直到连接超时时间。 AJAX 中的“A”是异步的,并且有充分的理由使用回调,它们的存在是有原因的。
如果您只是进行数据传递,请使用 JSON,即 JavaScript 对象表示法,这是一种简单的数据格式,恰好也是有效的 JavaScript。您可以对其使用
eval
,但我建议使用 JSON 解析器,我认为大多数现代浏览器都内置了它们(这里可能是错误的)。 JSON 很好,因为它可以表达复杂的数据结构,生成和解析简单并且得到广泛支持。Ignoring the fact that whatever you are doing is probably a bad idea, Prashanth has the right idea of inserting it into the DOM. you could also strip out the tags and just eval as "normal".
Not ignoring the fact that 1)
eval
is evil, 2) dynamically loading remote code is bad and 3) synchronous AJAX is extra bad, I have this to say:Unless you know what you are doing,
eval
ing anything is a bad idea, its hard to debug, can expose massive security flaws and all sorts of other nasties. You then compound this by loading remote code, which is apparently generated in a way outside of your control because you aren't able to get just the script. Synchronous Ajax is bad because there is only one thread in javascript, blocking on Ajax will literally lock up the entire page until it is loaded because even things like scrolling generate javascript events, which the currently busy engine has to check for handlers. While the request goes fast on your local machine, someone with a slow or poor quality connection could be waiting a while, up to the timeout time for the connection. The 'A' in AJAX is asynchronous, and for a good reason, use the callbacks, they are there for a reason.If you are just doing data passing, use JSON, which is JavaScript Object Notation, a simple data format that happens to also be valid JavaScript. You can use
eval
on it, but I suggest a JSON parser, i think most modern browsers have them built in (could be wrong here). JSON is good because it can express complex data structures, is simple to generate and parse and is widely supported.回顾一下 - 需要能够在加载之后/期间动态地将一些内容加载到页面上,并执行它。通过执行,我不仅仅意味着更改某些 div 上的文本 - 这很简单。但是,如果我们想动态加载一些新的 JS,比如来自外部源的警报,并注入它,连同它的脚本标签,也许还有一些其他 HTML 代码,那么解决方案是使用以下 jQuery 调用:
< code>dynamicResponse 来自异步
$.ajax({})
或XmlHttpRequest
响应。一旦出现,它就会附加到在appendTo()
中指定的任何 DOM 元素上并执行。Recapping - the need is present to be able to dynamically load some content onto a page after/during load, and have it execute. By execute, I don't just mean change the text on some div - that's easy. But if we want to load some new JS dynamically, say an alert that comes from some outside source, and inject it, along with it's script tags, and maybe some other HTML code, then the solution is to use the following jQuery call:
dynamicResponse
comes from an asynchronous$.ajax({})
orXmlHttpRequest
response. Once present, it is appended onto whatever DOM element, specified inappendTo()
and executed.这是例子
Here is the example