javascript找对象 — 7

  • 925
 //用id来查询,返回“对象”!
    console.log(document.getElementById('text1'));
    //用标签查询,返回值“对象的集合”,即使一个对象也会包装为“对象集合”返回。
    //alert(document.getElementsByTagName('P').length);  //TagName标签查询.lenght对象数
    ps = document.getElementsByTagName('P');
    ps[1].style.background = 'green';
    //对于表单元素,可以用name来查询,返回值是对象集合!
   alert(document.getElementsByName('username')[0].value);
   document.getElementsByName('username')[0].value = 'lucy';
   //按照类名查找,返回对象集合
   document.getElementsByClassName('text2')[0].style.background = 'gray';
    //找子节点
    //alert(document.getElementById('text1').childNodes.length);   7个节点含空白节点
    alert(document.getElementById('text1').children.length);  //3  children非标准属性,但兼容性更好,它不含空白节点!!!
    //找父节点
    document.getElementsByTagName('p')[2].parentNode.style.border = '1px solid green';
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>找对象</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="description" content="布尔教育 http://www.itbool.com" />
</head>
    <body>
        <h1></h1>
        <div id = "text1">
            <p>p1</p>
            <p>p2</p>
            <p>p3</p>
        </div>
        <div>class text2</div>
        <input type="text" name="username" id="" value="polt"/>
        
    </body>
    <script>
    //用id来查询,返回“对象”!
    console.log(document.getElementById('text1'));
    //用标签查询,返回值“对象的集合”,即使一个对象也会包装为“对象集合”返回。
    //alert(document.getElementsByTagName('P').length);  //TagName标签查询.lenght对象数
    ps = document.getElementsByTagName('P');
    ps[1].style.background = 'green';
    //对于表单元素,可以用name来查询,返回值是对象集合!
   alert(document.getElementsByName('username')[0].value);
   document.getElementsByName('username')[0].value = 'lucy';
   //按照类名查找,返回对象集合
   document.getElementsByClassName('text2')[0].style.background = 'gray';
    //找子节点
    //alert(document.getElementById('text1').childNodes.length);   7个节点含空白节点
    alert(document.getElementById('text1').children.length);  //3  children非标准属性,但兼容性更好,它不含空白节点!!!
    //找父节点
    document.getElementsByTagName('p')[2].parentNode.style.border = '1px solid green';
    </script>
</html>

javascript找对象 — 7

weinxin
我的微信
这是我的微信扫一扫
开拓者博主
  • 本文由 发表于 2016年6月3日22:17:32
  • 转载请务必保留本文链接:https://www.150643.com/48.html
匿名

发表评论

匿名网友 填写信息

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen: