js中document里的常用函数
js里要得到html中的元素,可以通过document里的函数获得。这样获得了html中的元素就可以方便的进行后续操作。获得html中的元素有三种方式,分别是通过id,name和tagname,其中html中元素的id要保持唯一,如果没有保持唯一的话,通过id方式获得的是html中的第一个此id的元素,此外id最好不要以数字开头,因为有些浏览器就会识别不出来,访问无效。通过name和tagname访问获得是元素集。代码如下:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html> <head> <title>document2.html</title> <script type="text/javascript"> function test1() { //创建元素 var myElement = document.createElement("input");//引号内写希望创建的html元素标签名 myElement.type="button"; myElement.value="我是button"; myElement.id="id1"; //给新的元素添加必要的信息 //myElement.href="http://www.sina.com"; //myElement.innerText="连接到新浪"; //myElement.style.left="200px"; //myElement.style.top="300px"; //myElement.position="absolute"; //添加到document.body //document.body.appendChild(myElement); //将元素添加到div document.getElementById("div1").appendChild(myElement); } function test2() { //删除一个元素 //document.getElementById("div1").removeChild(document.getElementById("id1")); //第二种比较灵活 document.getElementById("id1").parentNode.removeChild(); window.alert(document.getElementById("id1").parentNode.id); } </script> </head> <body> <input type="button" onclick="test1()" value="动态的创建一个超链接"/> <input type="button" onclick="test2()" value="删除一个元素"/> <div id="div1" style="width: 200px;height: 400px;border: 1px solid red;">div1</div> </body></html>
其中第一段注释部分是将元素添加到body上面.