Question

这段代码只是停留在Body中它完全符合我的期望，但我不明白为什么。

特别是我没看到如何调用webservice，看起来脚本将调用添加到Head部分并且可能重新加载页面但是我不确定并且不喜欢不知道或者这行意味着什么 - 脚本.onload = script.onreadystatechange = function（）

有人可以解释一下吗？

var script = document.createElement("script"),
    head = document.getElementsByTagName("head")[0],
    url = "https://services.postcodeanywhere.co.uk/PostcodeAnywhere/Interactive/FindByPostcode/v1.00/json.ws?";

// Build the query string
url += "&Key=" + encodeURI(pca_Key);
url += "&Postcode=" + encodeURI(postcode);
url += "&CallbackFunction=PostcodeAnywhere_FindByPostcode_End";

script.src = url;

// Make the request
script.onload = script.onreadystatechange = function () {
    if (!this.readyState || this.readyState === "loaded" || this.readyState === "complete") {
        script.onload = script.onreadystatechange = null;
        if (head && script.parentNode)
            head.removeChild(script);
    }
}

head.insertBefore(script, head.firstChild);

斯图

Answer 1

基本上，它正在进行JSONP调用以从postcodeanywhere.co.uk获取一些数据。 JSONP使用script个元素。来自postcodeanywhere.co.uk的脚本将调用脚本URL上CallbackFunction参数标识的函数，并将其传递给JavaScript对象文字，如下所示：

PostcodeAnywhere_FindByPostcode_End({
   name: value
})

你还没有表现出来，但可能是在进行调用的脚本中有一个在全局范围内定义了该名称的函数。

这是为了解决SOP，它不允许ajax调用跨域。

如何它是通过创建script元素，为其分配src网址，将其附加到网页，然后挂钩readystate来实现的。事件，因此它可以通过再次删除元素来清理自己。（最后一点并不完全是这样，并非所有浏览器都会在readystate元素上触发script事件，要彻底完成此操作，您必须同时挂钩readystate和{{1或者在回调中进行清理。但是脚本元素位于周围是无害的。）它也应该使用load，而不是encodeURIComponent。并且不需要使用encodeURI元素的内容，您只需将脚本直接附加到head。

Answer 2

此脚本以语法方式创建具有给定<script/>网址的src HTML标记，并将其附加到页面DOM中<head>的开头：

<head>
  <script src="https://services.postcodeanywhere.co.uk/PostcodeAnywhere/Interactive/FindByPostcode/v1.00/json.ws?&Key=...&Postcode=...&Postcode="></script>
  <!-- the rest of the HEAD -->
</head>

它还将事件处理程序附加到onload和onreadystatechange。加载脚本时会触发此事件。有趣的是，它会在加载后删除事件处理程序和<script/>标记，并自行清理。

脚本可能会在下载副作用后立即运行一些代码。例如。它创建一个全局对象或修改DOM。脚本完成后，会因某种原因将其删除。

Answer 3

1）它创建一个DOM元素

2）将它放在head元素中，然后下载它。

3）执行它

4）删除DOM元素。

请注意，以后可以使用任何全局函数和变量，因此可以执行它的代码，并删除它后访问的变量。

这段JavaScript如何工作？

3 个答案: