原生js获得八种方式,事件操作

08.17自我总结

关于js

一.原生js获得八种方式

• 通过ID获取（getElementById）
• 通过name属性（getElementsByName）
• 通过标签名（getElementsByTagName）
• 通过类名（getElementsByClassName）
• 通过选择器获取一个元素（querySelector）
• 通过选择器获取一组元素（querySelectorAll）
• 获取html的方法（document.documentElement）
• document.documentElement是专门获取html这个标签的
• 获取body的方法（document.body）
• document.body是专门获取body这个标签的

二.事件句柄

三.使用方法

1.获取单个元素

2.单个元素发送的事件

3.发生的内容相关替换

let inp = document.querySelector('input');

inp.onkeydown = function () {
    console.log('按下')
};

四.提取元素里面的内容

• innerHTML:获取文本包括标签
• innerText:获取文本不包括标签
• val:获取表单里面的值

五.补充知识点

获取操作父标签修改子标签

比如说我们点击a类修改下面的b类

let xx = document.querySelector('.a');
xx.onclick = function () {
    this.querySelector('.b').innerHTML='点击a了;
};

querySelectorAll获取一组元素后我们怎么把其中的内容取出来

let xx = document.querySelectorAll('.a');
for (let i = 0; i < xx.length; i++){
    console.log(xx[i]);
}