1:::::方法代码如下:

function getByClass(sClass){

    var aResult=[];

    var aEle=document.getElementsByTagName('*');

    for(var i=0;i<aEle.length;i++){

       /*当className相等时添加到数组中*/

       if(aEle[i].className==sClass){

            aResult.push(aEle[i]);

        }

    }

    return aResult;

};

调用方法(实际使用):

window.onload=function (){

    var aBox=getByClass("box");

    for(var i=0;i<aBox.length;i++){

       alert(aBox[i].innerHTML);

    }

};
----------------------------------------------------------------------
2::::::::::::::::::;如<div class="box aa bb"></div>,我们可以将class通过空格拆分成数组,如果要获取的class满足数组中的一个元素,那么就获得此元素。

方法代码如下:

function getByClass(oParent,sClass){//oParent获取类的父元素

    var aResult=[];

    var aEle=oParent.getElementsByTagName('*');
   

    for(var i=0;i<aEle.length;i++){

        /*将每个className拆分*/

        var arr=aEle[i].className.split(/\s+/);

        for(var j=0;j<arr.length;j++){

            /*判断拆分后的数组中有没有满足的class*/

            if(arr[j]==sClass){

                aResult.push(aEle[i]);

            }

        }

    }

    return aResult;

};

js通过class获取元素时的兼容性解决方案的更多相关文章

  1. 原生JS与JQ获取元素的区别

    刚学JQ不久,有时候可能会把JS和JQ获取元素的方式搞错,接下来获取属性方法什么的就一发不可收拾了,现在把两者获取获取元素的代码整理下. 一.原生JS获取元素. 1.常用的三种方式获取元素对象(将指定 ...

  2. js中获取元素的样式兼容性的写法

    1:设计元素的样式:el.style.color="red"||el.style["color"]="red"  获取元素的样式:el.st ...

  3. vue / js使用video获取视频时长

    项目中遇到上传视频功能,需要有预览和获取视频时长功能,因之前使用upload(有需要的话可以参考下我之前的文章),这里就不赘述,直接用来上传视频,不过在上传之前和上传成功后的钩子里,获取不到时长: 没 ...

  4. 原生js来写获取元素距离顶部距离,以及滚动条滚动指定距离和时间控制

    这是我在写vue项目里封装的一个公共js类 里面还有一些其他的方法,一并拿过来了 class Public { isDesktop(){ //判断是否为pc端 return (window.scree ...

  5. js通过class获取元素

    <!doctype html> <html> <head> <meta charset="utf-8"> <meta char ...

  6. JS——通过标签获取元素、循环语句、数组去重

    通过标签获取元素: var aLi = document.getElementsByTagName('Li'); aLi[0].style.backgroundColor = 'gold'; 选中部分 ...

  7. name值与id值在Js获取元素时的区别

    1.适用范围 除base.head.html.script.meta.title标签外,id都可以用:name只适用于select.form.frame.iframe.img.a.input等中. H ...

  8. 使用jquery日期选择器flatpickr.js,使用js动态创建input元素时插件失效

    最近写页面时需要用到,日期选择器,网上搜索了一些插件,最后使用了flatpickr.js.我是从npm 上拉下的依赖  npm install flatpickr --save 随后在页面中引入css ...

  9. js动画之获取元素属性

    首先我们要介绍一些知识 offsetWidth element.offsetWidth = width + padding + border; width 我们也知道element.style.wid ...

随机推荐

  1. SpringBoot更改HttpMessageConverters使用FastJson出现乱码问题

    1.出现问题的现象!如下截图,使用SpringBoot 进行开发,接口返回的内容出现中文乱码? 接口内容想要返回的内容: 页面返回内容: 惊喜不?意外不? 为什么出现这个情况?不例外的话,很多同事都是 ...

  2. 【Python】 docker-py 用Python调用Docker接口

    [docker-py] 官方文档:[https://docker-py.readthedocs.io/en/stable/images.html] 众所周知,Docker向外界提供了一个API来管理其 ...

  3. Jenkins集成Docker镜像实现自动发布

    1. 思路&流程 Jenkins集成Docker镜像实现自动发布与Jenkins发布mavne项目思路一样总体流程 为:Jenkins 拉去远端源码 -- gitl实现应用打包 -- jenk ...

  4. .NET Core快速入门教程 4、使用VS Code开发.NET Core控制台应用程序

    一.前言 为什么选择VS Code?VS Code 是一款跨平台的代码编辑器,想想他的哥哥VS,并是微软出品的宇宙第一IDE,那作为VS的弟弟,VS Code 也不会差,毕竟微软出品.反正ken是这么 ...

  5. 数据库 --> 5种关系型数据库比较

    5种关系系数据库比较 目前,商品化的数据库管理系统以关系型数据库为主导产品,技术比较成熟.面向对象的数据库管理系统虽然技术先进,数据库易于开发.维护,但尚未有成熟的产品.国际国内的主导关系型数据库管理 ...

  6. Algorithm --> 筛法求素数

    一般的线性筛法 genPrime和genPrime2是筛法求素数的两种实现,一个思路,表示方法不同而已. #include<iostream> #include<math.h> ...

  7. spring-boot-devtools

    Create a new Maven Project  and  we have two class under the package com.example.demo like below scr ...

  8. OpenGL学习笔记:第一个OpenGL程序

    OpenGL环境搭建参考博客:VS2015下OpenGL库的配置. #include<GL\glew.h> #include<GLTools.h> #include<GL ...

  9. New UWP Community Toolkit - Carousel

    概述 New UWP Community Toolkit  V2.2.0 的版本发布日志中提到了 Carousel 的调整,本篇我们结合代码详细讲解  Carousel 的实现. Carousel 是 ...

  10. 简单的C语言编译器--概述

      在学习了编译原理的相关知识后,逐渐的掌握一个编译器的结构.作用和实现方法.同时,希望自己在不断的努力下写出一个简单的C语言编译器. 实现步骤 词法分析器:将C语言测试代码分解成一个一个的词法单元: ...