JavaScript Dom基础

Posted 2020-08-26

一、DOM查找

　　　1、document.getElementById("id")

　　　　　-功能：返回对拥有指定ID的第一个对象的引用

　　　　　-返回值：DOM对象

　　　　　-说明：id为DOM元素上id属性的值

　　　2、document.getElementByTagName("tag")

　　　　　　-功能：返回一个对所有tag标签引用的集合

　　　　　　-返回值：数组

　　　　　　-说明：tag为要获取的标签名称

 

二、DOM设置元素样式

　　　1、ele.style.styleName=styleValue

　　　　-功能:设置ele元素的CSS样式

　　　　-说明

　　　　　　-ele为要设置样式的DOM对象

　　　　　　-styleName为要设置的样式名称

　　　　　　-styleValue为要设置的样式值

三、innerhtml和className

　　　　1、ele.innerHTML

　　　　　　-功能：返回ele元素开始和结束标签之间的HTML

　　　　2、ele.innerHTML="html"

　　　　　　-功能：设置ele元素开始和结束标签之间的HTML内容为html

　　　　3、ele.className

　　　　　　-功能：返回ele元素的class属性

　　　　4、ele.className="cls"

　　　　　　-功能：设置ele元素的class属性为cls

四、DOM属性设置与获取

　　1、ele.getAttribute("attribute")

　　　　-功能：获取ele元素的attribute属性

　　　　-说明；

　　　　　　-ele是要操作的DOM对象

　　　　　　-attribute是要获取的html属性（如：id,type）

　　2、ele.setAttribute("attribute",value)

　　　　-功能：在ele元素上设置属性

 　　　  -说明：

　　　　　　-ele是要操作的dom对象

　　　　　　-attribute为要设置的属性名称

　　　　　　-value为设置attribute属性的值