获取元素
获取元素对象
【1】根据ID来获取元素对象
document.getElementById()
获取到,返回元素对象
获取不到,返回null
【2】根据标签名来获取元素对象
从文档中获取 document.getElementsByTagName()
从指定标签中获取,父元素对象getElementsByTagName()
返回值 获取到,返回伪数组;获取不到,返回空的维数组
根据类名返回元素对象集合 document.getElementsByClassName(‘类名’);
根据指定选择器返回第一个元素对象 document.querySelector('选择器');
根据指定选择器返回 document.querySelectorAll('选择器');
事件基础
事件三要素
1.事件源(谁) 2.事件类型(什么事件)3.事件处理程序(做啥)
【1.获取事件源 2.注册事件(绑定事件) 3.添加事件处理程序(采用函数赋值形式)】
鼠标事件
触发条件
onclick
鼠标点击左键触发
onmouseover
鼠标经过触发
onmouseout
鼠标离开触发
onfocus
获得鼠标焦点触发
onblur
失去鼠标焦点触发
onmousemove
鼠标移动触发
onmouseup
鼠标弹起触发
onmousedown
鼠标按下触发
操作元素
改变元素内容
element.innerText
起始位置到终止位置的内容,但是它去除html标签,同时空格和换行也会去掉
element.innerHTML
起始位置到终止位置的全部内容,包括html标签,同时保留空格和换行
样式属性操作
1.行内样式操作
2.类名样式操作
【如果修改样式较多,可以采取修改类名方式更改元素样式】
【class因为是个保留字,因此使用className来操作元素类名属性】
【className会直接更改元素的类名,会覆盖原先的类名,但是可以采用多类名】
|
|