帶有 src AND 內容的 script-Tag 是什麼意思? (What does a script-Tag with src AND content mean?)


問題描述

帶有 src AND 內容的 script‑Tag 是什麼意思? (What does a script‑Tag with src AND content mean?)

Example from Googles +1 button:

<script type="text/javascript" src="https://apis.google.com/js/plusone.js">
      {"parsetags": "explicit"}
</script>

The script Tag has a src‑Attribute and content. What does this mean and how does it work?

‑‑‑‑‑

參考解法

方法 1:

Different browsers treat this differently. Some run the content only if the src is included without error. Some run it after attempting to include the src script, regardless of success. Since this behaviour is unreliable (and prohibited in HTML5), it should be avoided.

Google isn't relying an any specific behaviour. Since the content is just an object literal (a value), executing it would not actually do anything except cause a silent error. Google's code looks at the contents of the script tag itself, and adjust its behaviour based on that.

方法 2:

If a script element has a src attribute, the content must be ignored, any other behaviour is non‑conformant.

It has been suggested in blogs (as a hack) to put content in the element knowing that it won't be evaluated, then use DOM methods to get the content as a string and either eval it or insert it in a new script element. Neither of these are a good idea.

方法 3:

After the script has loaded, it looks inside its own script tag to access its content.

It will use some code similar to this:

var scripts = document.getElementsByTagName("script");
var data = eval(scripts[scripts.length ‑ 1].innerHTML);

Courtesy of John Resig.

方法 4:

According to the HTML5 draft specification, <script> elements with src attributes should only have commented‑out code, which is intended to give documentation for the script.  It doesn't appear as though Google is conforming to this specification though.

(by usrJeremyRobGJames BillinghamJim)

參考文件

  1. What does a script‑Tag with src AND content mean? (CC BY‑SA 3.0/4.0)

#javascript






相關問題

為什麼我不能在 IE8 (javascript) 上擴展 localStorage? (Why can't I extend localStorage on IE8 (javascript)?)

在 Javascript 中打開外部 sqlite3 數據庫 (Open external sqlite3 database in Javascript)

Javascript:數組中的所有對像都具有相同的屬性 (Javascript: All Objects in Array Have Same Properties)

為什麼我們要在 javascripts 原型中添加函數? (Why do we add functions to javascripts prototype?)

顯示 URL javascript 的最後一部分? (Display the last part of URL javascript?)

Javascript XMLHttpRequest:忽略無效的 SSL 證書 (Javascript XMLHttpRequest: Ignore invalid SSL Certificate)

有沒有辦法測試 console.log 整體 (Is there a way to test for console.log entires)

如何從 javascript 對像中獲取名稱和值到新列表中? (How to get name and values from a javascript object into a new list?)

數據未發布..幫助!html,js,firebase (Data not posting.. Help! html,js,firebase)

使用 Node.js 腳本查看表單數據 (Seeing form data with Node.js script)

使用百分比查找範圍內的值 (find the value within a range using percent)

如何通過 react.js 中的組件傳遞變量或數據? (How to pass varible or data through components in react.js?)







留言討論