跟着黑马视频学JS第四天

DOM

获取元素

1、document.getElementById('id')//获取带ID的元素对象 返回值是一个element对象
2、document.getElementsByTagName('标签名')//获取标签对象 返回的是元素对象的集合 以伪数组的形式存储
如果页面中没有这个元素 会返回一个空的伪数组
获取父元素内部是指定标签名的子元素时，element.getElementsByTagName('标签名');
父元素必须是单个对象
例：var ol = document.getElementsByTagName('ol');
    console.log(ol[0].getElementsByTagName('li'));//注意是ol[0]而不是ol 因为这里ol是一个伪数组
    也可以通过ID选择器直接选取：
    var ol = document.getElementById('ol');
     console.log(ol.getElementsByTagName('li'));//这里的ol是单个对象
3、document.getElementsByClassName('类名')//H5新增 返回对象集合
4、document.querySelector('选择器')//H5新增 根据指定选择器返回第一个元素对象 选择器需要加符号 .class #id
5、document.querySelectorAll('选择器')//H5新增 返回指定选择器的所有元素对象集合
6、获取body元素：document.body;
7、获取html元素：document.documentElement;
8、element.getAttribute('属性');//主要用于获取自定义属性
9、element.setAttribute('属性','值');//修改自定义属性
10、element.removeAttribute('属性');//移除自定义属性
11、H5规定自定义属性以data-开头作为属性名并赋值

事件

事件三要素：事件源、事件类型、事件处理程序
改变元素内容：
    element.innerText//不识别HTML标签 不用
    element.inneerHTML//识别HTML标签 保留空格和换行
样式属性操作：element.style:fontSize //驼峰命名法 行内样式表
element.className//类名样式操作 适用于样式修改较多 会覆盖原先的类名

显示/隐藏密码案例

排他思想

视频很多案例看了一遍不一一记录了

学习JS第四天

跟着黑马视频学JS第四天

DOM

获取元素

事件