js属性选择器有几种,js类名选择器
Javascript类选择器方法
浏览器作为一个生态和平台，会提供一系列编程语言可以调用和控制的函数方法。对于浏览器来说，通过Javascript语言调用浏览器的内置方法是很自然的。对于操作系统，大多数语言都可以调用它的API。
CSS id选择器或类选择器可以给HTML元素添加样式。浏览器平台和CSS一样，也提供了可以被Javascript语言调用的id选择器和类选择器方法。之前使用的id选择器方法是getElementById()。本文要讲解的类选择器的方法是getElementsByClassName()，你可以通过它们的名字来判断它们想要表达什么。标准委员会并不是心血来潮地随意制定这些标准，而是试图按照它们的含义来思考它们的名称。当然，顾名思义这是针对英语的。
ID的特点是二选一，class的点特点是批量选择。比如通过Javascript动态批量添加一些元素的样式属性，主要使用getElementsByClassName()方法。【相关推荐：JavaScript视频教程】
案例
在已经写好的HTML和css文件的基础上添加Javascript代码，让用户可以在网页上批量定制元素的样式。
48 body style=背景色：#777777
49 !-自定义颜色功能按钮-
50 button style= background-color:# 00 aaff id= button 1 onclick= fun 1()/button
51 button style= background-color:# 1 ABC 9c id= button 2 onclick= fun 2()/button
52 !- Web应用程序界面命令-
53 div class=command
54 !-评论空间-
5div class=底部填充半径left-radius div arc /div！-
56-div class=底部填充div 直线/div！-
57-div class=底部填充div 矩形/div！-
58-div class=底部填充div 曲线/div！-
59-div class=右半径填充div 倒角/div
60/格
61脚本
2//批量选择class属性为div的所有元素，返回所有元素对象的数组。
63 let arr=document . getelementsbyclassname( div )；
6//定义两个函数fun1和fun2来改变颜色
65函数fun1() {
6//遍历所有元素对象
67 for(设I=0；iarr .长度；i ){
68 //更改背景颜色
69 arr[I]. style . background color= # 00 aaff ；
70 }
71 }
72函数fun2() {
73 for(设I=0；iarr .长度；i ){
74 arr[I]. style . background color= # 1 ABC 9 c ；
75 }
76 }
77/脚本
78/车身代码分析
第53到60行定义了应用程序界面的一系列命令按钮。第50行和第51行定义了两个带有其他元素自定义样式的功能按钮。当你点击其中一个函数按钮时，你将调用脚本标签中的函数fun1()或fun2()。例如，fun1函数执行后，第53行到第60行定义的元素的背景颜色将被批量修改，从灰色修改为#。
第63行通过类选择器方法getElementsByClassName()选择所有类属性名为“div”的元素。getElementById()方法返回一个对象，即元素本身，getElementsByClassName()方法返回所有元素对象的数组。也就是说，如果要改变一个元素的属性值，可以通过数组下标的方式来访问该元素。例如，arr[0]表示第55行中定义的div元素。如果直接写arr . style . background color= # 00 aff ；改变arr的所有元素的背景色是非法的。arr是一个数组，它没有. style属性。你应该以arr [i]的形式重置元素的背景色。style.backgroundcolor= # 00aff。
要改变的元素很多，而且要改变的元素颜色都是一样的，所以可以用for循环结构程序来完成。第67到70行代码的功能是遍历数组arr中的所有div元素，然后更改它们的背景颜色。
第65行和第72行分别定义了fun1和fun2，用鼠标点击事件就可以调用它们。fun1的作用是批量将元素背景色改为# 00aff，fun1的作用是批量将元素背景色改为#1abc9c。
getElementsByTagName()
getElementsByTagName()方法可以像getElementsByClassName()方法一样批量选择元素，返回的结果从数据类型的角度来看都是数组对象。不同的是getElementsByTagName()方法是通过元素的标记名来选择元素的，对应的CSS知识点是元素选择器，getElementsByTagName()方法名称中的英文标记就是标记的意思。
应用
我学过一些选元素的方法，知道各自的特点，只是为了应用。实际应用中如何选择getElementById()、getElementsByClassName()和getElementsByTagName()。这个可以参考CSS。在CSS中，通常使用类选择器，偶尔使用元素和id选择器，并使用元素的标记名来选择元素。如果一个完整的页面在很多地方都需要一个元素，而这些元素比如说需要不同的背景色，那么在使用getElementsByTagName()方法的时候就会误伤。getElementsByClassName()的优点是可以直接粘贴一个类属性名。在实践中，我们经常关注代码复用，其实就是分类。比如一个网站往往有一个主题背景色，网站几千几万个页面都是某种颜色。您只需要定义一个颜色类样式，然后将这个类名引入每个页面。
总结
本文不仅解释了getElementsByClassName()方法，还解释了Javascript中通过比较选择元素的三种方法，分别对应于CSS中的元素选择器、id选择器和类选择器。通过CSS选择器和Javascript选择器(DOM方法)的对比，可以减轻学习的记忆负担，从系统的角度学习技术，从标准委员会制定者的角度理解一个技术标准。以上是Javascript类选择器方法的详细内容。更多请关注我们的其他相关文章！
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。