createElement 創(chuàng)建 HTML 元素,在 IE4.0 中只能創(chuàng)建 img、area、option,不過在 IE5 中,我們可以創(chuàng)建除 frame、iframe 以外的所有元素。
語法:
oElement = document.createElement(sTag)
sTag 要創(chuàng)建的元素名字,如:img、select、input,字符串類型。
返回值:返回新元素的引用。
創(chuàng)建之后:
創(chuàng)建之后,我們可利用 insertBefore 或 appendChild 將元素顯示在頁面中?!?/p>
<div id="board"></div>
<script type="text/javascript">
<!--
var board = document.getElementById("board");
var e = document.createElement("select");
var obj = board.appendChild(e);
-->
</script>
上例中,創(chuàng)建一個下拉列表框,并追加到層 board 中。
創(chuàng)建元素后,可對元素進行進一步操作。
<div id="board"></div>
<script type="text/javascript">
<!--
var board = document.getElementById("board");
var e = document.createElement("select");
var obj = board.appendChild(e);
obj.options[0] = new Option("追加的項", "");
obj.size = 2;
//如下寫法也是正確的:
//e.options[0] = new Option("追加的項", "");
//e.size = 2;
-->
</script>
創(chuàng)建 input
與 input 有關的元素有很多,比如:checkbox、radio、submit、reset...,因此創(chuàng)建 input 是個很特殊的用法。
創(chuàng)建不同的 input 正確的做法是:
<div id="board"></div>
<script type="text/javascript">
<!--
var board = document.getElementById("board");
var e = document.createElement("input");
e.type = "radio"; //緊接著上一行寫
var obj = board.appendChild(e);
obj.checked = true;
//如下寫法也是正確的:
//e.checked = true;
-->
</script>
針對 input,在 Netscape、Opera 和 Firefox 中 e.type 既可以在 appendChild 之前,也可以在其之后。但在 IE 中 type 屬性必須在前,其它屬性必須在后。
IE 創(chuàng)建元素,還有一個特點,就是可以連同屬性一同創(chuàng)建,比如:var e = document.createElement("<input type=''radio'' name=''r'' value=''1'' />"); 這在其它瀏覽器中是不行的,所以我們也不支持。
總結:
針對非 input 元素,各瀏覽器中,既可以把對元素屬性的改變寫在顯示元素(insertBefore 或 appendChild)之前,也可以在其后。
針對 input 元素,為了兼容 IE,type 屬性寫在顯示元素(insertBefore 或 appendChild)之前,其它屬性寫在其后。
推薦:
除了 input 元素的 type 屬性寫在顯示元素(insertBefore 或 appendChild)之前外,其它屬性都寫在顯示元素之后。
改變屬性時,對寫在顯示元素(insertBefore 或 appendChild)之前的用 createElement 的返回值,對寫在顯示元素之后的用 insertBefore 或 appendChild 的返回值。
文章出處:http://www.diybl.com/course/1_web/javascript/jsjs/200838/103449.html
聯系客服