close

[JavaScript HTML DOM]使用document物件,使用屬性document.documentElement用法之一

說明:
document.documentElement 回傳此網頁文件中的根元素 (root element) ,
取得html的 HTML element的物件 。
取得名稱,document.documentElement.nodeName
取得子元素,document.documentElement.childNodes

此範例設計說明:
第一步、取得目前的document.documentElement
第二步、取得名稱,document.documentElement.nodeName
第三步、取得子元素,document.documentElement.childNodes
第四步、取出有那些子元素
第五步、顯示在頁面上
程式:
<html>
<head>
<title>[JavaScript-HTML_DOM]使用document物件,使用屬性document.documentElement用法之一</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script>
function mytest() {
var returnData="";
var rootElement = document.documentElement;
returnData = rootElement.nodeName;
var childNodes = rootElement.childNodes;
for (var i = 0; i < childNodes.length; i++) {
returnData = returnData + childNodes[i]
}
document.getElementById("returnData").innerHTML=returnData
}
</script>
</head>
<body>
[JavaScript-HTML_DOM]使用document物件,使用屬性document.documentElement用法之一<br>
<input type="button" value="測試" onclick="mytest()" />
<span id="returnData"></span>
</body>
</html>
圖:


按下測試


相關範例:
待續





 






 















其它文章

arrow
arrow

    PG Levin Li 發表在 痞客邦 留言(0) 人氣()