首頁 > 開發者 > JavaScript
標籤：pre cli 一行代碼 說明 版本 pretty 地方 string body
原文章：http://www.cnblogs.com/suntrain/p/5663794.html
動態指令碼指的是在頁面載入時不存在，但將來的某一時刻通過修改該DOM動態添加的指令碼。和操作HTML元素一樣，建立動態指令碼也有兩種方式：插入外部檔案和直接插入JavaScript代碼。
動態載入外的外部JavaScript檔案能夠立即運行，比如下面的<script>元素。
<script type="text/javascript" src="client.js"></script>
而建立這個節點的DOM代碼如下所示：
var script = document.createElement("script");script.type = "text/javascript";script.src = "client.js";document.body.appendChild(script);
顯然這裡的DOM如實的反映了相應的HTML代碼。不過執行最後一行代碼把<script>元素添加到頁面之前，是不會下載外部檔案的。也可以把這個元素添加到<head>元素中效果相同。整個過程可以使用下面的函數來封裝：
function loadscript(url) { var script = document.createElement("script"); var script.type = "text/javacript"; script.src = url; document.body.appendChild(script);}
然後，就可以通過調用這個函數來載入外部的JavaScript檔案了：
loadScript("client.js");
載入完成後，就可以在頁面中的其它地方使用這個指令碼了。
另一種指定JavaScript代碼的方式是行內方式，如下面的例子所示：
<script type="text/javascript">function sayHi() { alert("hi");}</script>
從邏輯上講，下面的DOM代碼是有效：
var script = document.createElement("script");script.type = "text/javascript";script.appendChild(document.createTextNode("function sayHi() {alert(‘hi‘);}"));document.body.appendChild(script);
在Firefox、Safari、Chrome和Opera中，這些DOM代碼可以正常運行。但在IE中，則會導致錯誤。IE將<script>視為一個特殊的元素，不允許DOM訪問其子節點。不過，可以使用
<script>元素的text屬性來指定JavaScript代碼，想下面的例子這樣：
var script = document.creatElement("script");script.type = "text/javascript";script.text = "function sayHi() {alert(‘hi‘);}";document.body.appendChild(script);
經過修改之後的代碼可以在IE、Firefox、Opera和Safari3.0中運行。Safari3.0之前的版本雖然不能正確的支援text屬性，但卻允許使用文本節點技術來指定代碼。如果需要相容早期版本的Safari，可以使用下列代碼：
var script = document.createElement("script");script.type = "type/javascript";var code = "function sayHi() {alert(‘hi‘);}";try { script.appendChild(document.createTextNode(code));} catch (ex) { script.text = code;}document.body.appendChild(script)
這裡首先嘗試標準的DOM文本節點方法，因為除了IE（在IE中會導致拋出錯誤），所有的瀏覽器都支援之中方式。如果這行代碼拋出了錯誤，那麼說明是IE，於是就必須使用text屬性了，整個過程可以用以下函數來表示：
function loadScriptString(code) { var script = document.createElement("script"); script.type = "text/javascript"; try { script.appendChild(document.createTextNode(code)); } catch (ex) { script.text = code; } document.body.appendChild(script);}loadScriptString("function sayHi() {alert(‘hi‘);}");;
JS動態添加JavaScript語句
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
