使用javascript通过className来获取元素

简介: 开始慢慢从JQUERY再转回到纯JS。。。代码//原理: 用document.getElementsByTagName('*');来获取所有元素,然后取得相同Class的元素。function getElementsByClassName(n) {    var classElements = [], allElements = document.

开始慢慢从JQUERY再转回到纯JS。。。

img_405b18b4b6584ae338e0f6ecaf736533.gif 代码
// 原理: 用document.getElementsByTagName('*');来获取所有元素,然后取得相同Class的元素。
function  getElementsByClassName(n) {
    
var  classElements  =  [], allElements  =  document.getElementsByTagName( ' * ' );
    
for  ( var  i  =   0 ; i  <  allElements.length; i ++ ) {
        
if  (allElements[i].className  ==  n) {
            classElements[classElements.length] 
=  allElements[i];
        }
    }
    
return  classElements;
}

 

 // 原来class为showye的全去掉    

var  XX  =  getElementsByClassName( ' shouye ' );
    
for  ( var  i  =   0 ; i  <  XX.length; i ++ ) {
        XX[i].className 
=   "" ;
    }

 

目录
相关文章
|
29天前
|
JavaScript 前端开发
JavaScript操作DOM元素
JavaScript操作DOM元素
11 1
|
1月前
|
JavaScript 前端开发
JavaScript如何遍历表单元素?
JavaScript如何遍历表单元素?
|
3月前
|
JavaScript
如何用js在页面中添加元素?
如何用js在页面中添加元素?
27 0
|
2天前
|
JavaScript 前端开发
js怎么删除html元素
js怎么删除html元素
17 10
|
2天前
|
JavaScript 前端开发
js添加、删除、替换或插入元素。
js添加、删除、替换或插入元素。
6 0
|
1月前
|
JSON JavaScript 前端开发
JavaScript随手笔记---数组中相同的元素进行分组(数据聚合) groupBy函数
JavaScript随手笔记---数组中相同的元素进行分组(数据聚合) groupBy函数
|
1月前
|
JavaScript 前端开发
JS获取DOM元素的八种方法(含代码,简单易懂)
JS获取DOM元素的八种方法(含代码,简单易懂)
|
1月前
|
移动开发 HTML5
编程笔记 html5&css&js 024 HTML表单元素
编程笔记 html5&css&js 024 HTML表单元素
|
2月前
|
移动开发 前端开发 JavaScript
H5+CSS3+JS逆向前置——HTML1、H5文本元素
H5+CSS3+JS逆向前置——HTML1、H5文本元素
27 0
|
2月前
|
前端开发 JavaScript API
JavaScript中多种获取数组最后一个元素的策略。
欢迎来到前端入门之旅!这个专栏是为那些对Web开发感兴趣、刚刚开始学习前端的读者们打造的。无论你是初学者还是有一些基础的开发者,我们都会在这里为你提供一个系统而又亲切的学习平台。我们以问答形式更新,为大家呈现精选的前端知识点和最佳实践。通过深入浅出的解释概念,并提供实际案例和练习,让你逐步建立起一个扎实的基础。无论是HTML、CSS、JavaScript还是最新的前端框架和工具,我们都将为你提供丰富的内容和实用技巧,帮助你更好地理解并运用前端开发中的各种技术。