JavaScript属性操作(获取元素)——2018-02-24

1、通过ID获取元素:(静态获取)

var oDiv = document.getElementById('div1');

2、通过标签获取元素:(动态获取)

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
<script>
/*
#list {}        var oUl = document.getElementById('list');静态方法

li {}           document.getElementsByTagName('li');    动态方法
#list li {}  var aLi = oUl.getElementsByTagName('li');
                            // aLi => [ li, li, li ]     元素的集合
                            aLi.length                              3
                            aLi[0]
                            // 在用 TagName 的时候,必须要加上:[]
*/
window.onload = function (){
    //  var oUl = document.getElementById('list');
    var oUl = document.getElementsByTagName('ul')[0];
    var aLi = oUl.getElementsByTagName('li');
    
    // document.getElementsByTagName('li');
    
    // alert( aLi.length );
};
</script>
</head>

<body>

<ul id="list">
    <li></li>
    <li></li>
    <li></li>
</ul>

<ol>
    <li></li>
    <li></li>
</ol>

</body>
</html>

3、特殊标签的获取:

如果一个页面中只有一个这样的标签,那么可以这样获取该标签:
例如body、title...

document.body
document.title
......

4、静态与动态获取方法的区别:

① 通过ID来获取元素只能用document.不能用其他的,如果用tag来获取某个元素,(比如获取id=“oUl”的ul下面的li)

var oUl = document.getElementById('oUl');
var oLi = oUl.getElementsByTagName('li');

② 静态获取方法在使用时只会获取一次,如果没有获取到元素即便在获取语句的后面通过JS添加了元素进去,也不会获取到。
动态获取方法会一直尝试获取元素,直到所有的代码加载完毕,即便当时没有获取到,但是后面如果通过JS添加了也是可以获取到的。
③ 静态方法获取的元素可以直接使用,但是动态方法获取的元素是一个集合,在使用时必须加上指定的下标。注意:动态方法获取的不是数组而是集合,但是这个集合有数组的属性,但没有数组的一些方法。

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 135,026评论 19 139
  • 1. Java基础部分 基础部分的顺序:基本语法,类相关的语法,内部类的语法,继承相关的语法,异常的语法,线程的语...
    子非鱼_t_阅读 31,780评论 18 399
  • 很多年前便想写这篇,多次因不知从何而起,从何处而终便一拖再拖,就像此时断符又停在这里闪烁许久。 我最怕的是家族的劣...
    A_阿黑阅读 264评论 0 0
  • 2017年9月19日 每天自问 1.今天留意时间怎么花掉的。 上午,6:00-7:40,起床,看书《与时间做朋友》...
    雪狼K阅读 180评论 0 0
  • 今天天气冷,老公中午没吃饭要出去吃点,我带孩子跟着一起出去溜达一下。突然接到送煤气的电话。我说先回去一下,就骑电动...
    给给阅读 166评论 1 0