获取方法一(普通版) 获取单一的class:
function getByClass(oParent, sClass) {//两个形参,第一个对象oParent 第二个样式名class
var aEle = oParent.getElementsByTagName("*");//从对象里选择所有元素
var aResult = [];//存放匹配出来结果的数组
for (var i = 0; i < aEle.length; i++) {//遍历所有oParent元素里面的所有元素
if (aEle[i].className == sClass) {//如果选出了的第i个元素等于传进来的参数的类名
aResult.push(aEle[i]);//就把结果添加到数组里面
}
}
return aResult; //返回数组
}
 
获取方法二(完美版)
 1、多个class获取—>正则表达式

function getByClass(oParent, sClass) {
var aEle = oParent.getElementsByTagName('*');
var aResult = [];
var re = new RegExp('\\b' + sClass + '\\b', 'i');//正则表达式,\b是单词分界处, for ( var i = 0; i < aEle.length; i++) {
if (re.test(aEle[i].className)) {//test方法返回Boolean的值
aResult.push(aEle[i]);
}
} return aResult;
}

  2、 多个class获取—>数组:

 function getByClass(oParent, sClass) {
var aResult = [];
var aEle = oParent.getElementsByTagName('*');
for (var i = 0; i < aEle.length; i++) {
var arr = aEle[i].className.split(/\s+/);
for (var j = 0; j < arr.length; j++) {
if (arr[j] == sClass) {
aResult.push(aEle[i])
}
}
}
return aResult;
};
获取方法三(复杂版)
function getClass(classname, obj) {//obj就是找的标签范围;  
var obj = obj || document;//如果obj没有参数传进来的话就为假,就返回document;
var arr = [];//设置一个数组来存储在ie下标签的className属性值等于类名的元素;
if (document.getElementsByClassName) {//如果条件为真,就代表浏览器为火狐;
return document.getElementsByClassName(classname)//火狐下面直接返回结果;
} else {//不是火狐
var alls = document.getElementsByTagName("*");//首先找到页面所有的标签;
for (var i = 0; i < alls.length; i++) {
if (checkclass(alls[i].className, classname)) {//1.1.回调函数判断类名,因为同一标签可能有多个类名;
arr.push(alls[i])//1.3.如果是真的,就把这个元素推进数组里面;
}
}
return arr;
}
}
function checkclass(startclass, endclass) {//判断类名
var arr = startclass.split(" ");//多个类名用空格分隔成不同元素的数组;
for (var i = 0; i < arr.length; i++) {
if (arr[i] == endclass) {//1.2.被分割的数组元素里面如果有一个等于classname就返回真;
return true;
}
}
return false;
}
 
 

封装getByClass(JS获取class的方法封装为一个函数)的更多相关文章

  1. 兼容各版本浏览器,封装原生Js获取ClassName

    web前端开发工作中常常会用到获取元素的className,用jQuery的$(".class")方法也可以获取className,但是有时候牵扯到数据而影响的加载顺序的原因会获取 ...

  2. 原生js获取鼠标坐标方法全面讲解-zmq

    原生js获取鼠标坐标方法全面讲解:clientX/Y,pageX/Y,offsetX/Y,layerX/Y,screenX/Y 一.关于js鼠标事件综合各大浏览器能获取到坐标的属性总共以下五种:eve ...

  3. js获取域名的方法

    本文实例讲述了js获取域名的方法.分享给大家供大家参考.具体实现方法如下: 复制代码代码如下: <script>//获取域名var k_host = window.location.hos ...

  4. JS1 js获取dom元素方法

     js获取dom元素方法  1.通过ID选取元素(getElementById) 1)使用方法:document.getElementById("domId")         其 ...

  5. 【功能代码】---4用JS获取地址栏参数方法

    用JS获取地址栏参数方法 // 方法一:采用正则表达式获取地址栏参数:( 强烈推荐,既实用又方便!) function GetQueryString(name) { var reg = new Reg ...

  6. 使用JS获取当前地理位置方法汇总

    使用JS获取当前地理位置方法汇总 投稿:hebedich 字体:[增加 减小] 类型:转载 时间:2014-12-18我要评论 这篇文章主要介绍了使用JS获取当前地理位置方法汇总,需要的朋友可以参考下 ...

  7. 【JS】---4用JS获取地址栏参数方法

    用JS获取地址栏参数方法 // 方法一:采用正则表达式获取地址栏参数:( 强烈推荐,既实用又方便!) function GetQueryString(name) { var reg = new Reg ...

  8. js 检查登录态方法封装(闭包、状态缓存)

    前端页面开发时,经常需要异步校验登录态,每次都重新copy之前写的方法,比较繁琐不好维护,固将登录态校验封装成一个js. (function(){ //登录状态 1 登录态有效 2 登录态无效 3 请 ...

  9. iOS OC和JS的交互 javaScriptCore方法封装

    一.javaScriptCore javaScriptCore是一种JavaScript引擎,主要为webKit提供脚本处理能力,javaScriptCore是开源webkit的一部分,他提供了强大的 ...

随机推荐

  1. ffplay使用笔记

    ffplay播放yuv文件命令: ffplay -f rawvideo -video_size 1920x1080 a.yuv   ffplay播放mp4.h.264.hevc文件命令: ffplay ...

  2. python2.7练习小例子(十四)

        14):题目:利用条件运算符的嵌套来完成此题:学习成绩>=90分的同学用A表示,60-89分之间的用B表示,60分以下的用C表示.     程序分析:程序分析:(a>b)?a:b这 ...

  3. python2.7入门---面向对象

        Python从设计之初就已经是一门面向对象的语言,正因为如此,在Python中创建一个类和对象是很容易的.所以,这篇文章我们来记录下Python的面向对象编程.如果你以前没有接触过面向对象的编 ...

  4. 什么是OSS/BSS(电信业务)

    电信业务运营支持系统(BOSS),面对客户是统一的:面对电信运营商,它融合了业务支撑系统(BSS)与运营支撑系统(OSS),是一个综合的业务运营和管理平台,同时也是真正融合了传统IP数据业务与移动增值 ...

  5. Hibernate-ORM:14.Hibernate中的命名查询

    ------------吾亦无他,唯手熟尔,谦卑若愚,好学若饥------------- 本篇博客讲述命名查询,所谓命名查询是什么呢? Hibernate中允许我们在xml,实体类,甚至注解的方式来编 ...

  6. linux里面的fork函数创建一个新进程

    由fork创建的新进程成为子进程,fork函数被调用一次,但是返回两次,

  7. 关于ArrayList add()方法 中的引用问题

    ArrayList的add方法每次添加一个对象时,添加 的是一个对象的引用,比如进行循环操作10次  lists.add(a) 每次 a会改变 ,这时候你会发现你在lists里添加了10个相同的对象a ...

  8. 【多校联合】(HDU6043)KazaQ's Socks

    [多校联合](HDU6043)KazaQ's Socks 一条纯粹的水题,记录下只是因为自己错的太多而已. 原因在于对数据的细节的把握不佳. 原题 KazaQ's Socks Time Limit: ...

  9. LR创建数据源读取excel

    1 在window上创建数据源   2 创建对应的数据文件 excel 注:注意格式和底部的表单名称 3 Vegen中创建参数 注意:机器数据源选择windows的ODBC数据源 SQL查的是(she ...

  10. 第十五篇 Python之文件处理

    一 文件操作  介绍 计算机系统分为:计算机硬件,操作系统,应用程序三部分. 我们用python或其他语言编写的应用程序若想要把数据永久保存下来,必须要保存于硬盘中,这就涉及到应用程序要操作硬件,众所 ...