使用JS来控制与创建DOM元素,获取DOM中的类名并赋值

获取DOM元素的方法有:

1.获取id选择器:

document.getElementById(“ele”)(ele是元素的id名,不需要加#)

2.获取class选择器:

document.getElementsByClassName(“ele”)(ele是元素的class名,不需要加’点’)(获取到的class是个类数组,若多个class要获取的话要在后面加[i]来获取,i是索引值index)

3.获取元素标签名:

document.getElementsByTagName(ele)(ele是标签名,直接写标签名,获取到的标签名也是个类数组)

4.获取文档中的css选择器中的指定元素:

document.querySelector(ele)(这的ele跟前面的不同,因为这是个通用选择器,类似css选择器,所以class需要加点,id需要加#)
class的区别在于,选择的是第一个,而不是一个数组,比较具有针对性

创建DOM的方法:

1.创建DOM元素:document.createElement(ele)(ele写标签名)
2.需要把创建的添加到body或者需要此标签名的地方:document.body.appendChild(ele)

第二句的意思就是在body中添加ele这个元素;

3.若需要在创建的ele中添加文字,则需要创建文本,然后写入,document.createTextNode(‘text’)(变量不需要引号,引号则是直接写字符串)
添加也是使用appendChild()需要在元素中添加

使用JS来获取DOM中的class类名

var demo=ele.className(属性来获取,可以赋给变量,之后可赋给其他元素)(ele是一个已经通过JS获取的DOM元素)

css中类名快捷

复用性类名:.demo,.todo(逗号隔开)
父子层级关系:.demo .todo(空格隔开)

猜你喜欢

转载自blog.csdn.net/weixin_42396868/article/details/85059835