复制代码代码如下:
< html >
< head >
< title >< /title >
< script >
/*
document节点对象的获取方式:
*/
//第一种,通过id获取
function documentDemo(){
var tableNode = document.getElementById("tab_id");
tableNode.style.border = "5px solid #00ff00";
}
//第二种,通过name属性
function documentDemo2(){
var inputNode = document.getElementsByName("txt");
alert(inputNode.length);
alert(inputNode[0].value);
}
//第三种,通过标签名
function documentDemo3(){
var tdNode = document.getElementsByTagName("td");
alert(tdNode.length);
for(var x = 0 ; x < tdNode.length;x++){
alert(tdNode[x].innerText);
}
}
< /script >
< style type="text/css" >
.onediv{
width:200px;
height:100px;
border:1px solid #f00;
margin-top:20px;
}
table ,td{
border:1px solid #00f;
width:200px;
margin-top:20px;
text-align:center;
}
< /style >
< /head >
< body >
< input type="button" value="document对象演示" onclick="documentDemo3()" >< br/ >
< div >
这是div中的内容
< /div >
< input type="txt" name="txt" >
< input type="txt" name="txt" >
< table cellspacing="0" id="tab_id" >
< tr >
< td >java< /td >
< td >php< /td >
< /tr >
< tr >
< td >.net< /td >
< td >ios< /td >
< /tr >
< /table >
< span >这是一个span区域< /span > < br/ >
< a href="#" >这是一个超链接< /a >
< body >
< /html >