html dom

nethub2

浏览: 240646 次
性别:
来自: 北京

最近访客更多访客>>

wangyy

yyy6419

where445

soberlevi

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
    <style>
        .rank{
            position: absolute;
            text-align: center;
            top: 20px;
            left: 20px;
            font-size: small;
            background-color: yellow;
            color: black;
            border: thin solid white;
            width: 80px;
            height: 80px;
            z-index: 99;
         }
         #div1 {
					  height:        270px;
					  padding:       10px;
					  border: thin solid red; 
					  background-color: purple;
					  margin:        auto 20px auto 20px;
				}
		
    </style>
    <script>
        //在Dom树内，一切都是节点： 元素，文本，属性，注释。
        //节点元素有getAttribute() 和 setAttribute()
        var manganese = document.getElementById('xx').value;
        var firstData = document.getElementByTagName("p")[0];
        var htmlElement = document.documentElement;//HTML文档的<html>根元素
        var myImage = document.createElement("img");
        var favShows = document.createTextNode("24 and lost");
        divNode.parentNode;
        divNode.childnodes;
        divNode.firstChild;
        divNode.lastChild;
        divNode.nodeName;
        divNode.nodeValue;//nul / undefined
        divNode.nodeType;
        // 每种节点类型(元素, 文本, 属性)都具有一个数字。但是尽力不用Node,很多浏览器不支持。
        if(someNode.nodeType == Node.ELEMENT_NODE){
            //DO SOMETHING FOR ELEMENT
        }else if (someNode.nodeType == Node.TEXT_NODE) {
            // DO SOMETHING FOR TEXTNODE
        }
        divNode.parentNode.getAttribute("id").nodeValue;
        //替代 删除 追加
        //onclick()
        divNode.appendChild(imgElement);
        divNode.insertBefore(imgElement);
        divNode.replaceNode(imgElement);
        document.getElementById("top5").childNodes.length;
        document.getElementById("top5").childNodes[i].nodeName.toLowerCase();
    </script>
</head>
<body>
    <p style="color: red">hello world</p>
     <div id="div1">
         <br/>
         <span class="rank">this is a span</span>   
         <br/>
     </div>
</body>
</html>

分享到：