JS获取class的方法一:

普通版:

<script type="text/javascript">
function getByClass(oParent, sClass)
{
 var aEle=oParent.getElementsByTagName('*');
 var aResult=[];
 var i=0;
 
 for(i=0;i<aEle.length;i++)
 {
  if(aEle[i].className==sClass)
  {
   aResult.push(aEle[i]);
  }
 }
 
 return aResult;
}

</script>

JS获取class的方法二:

完美版:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script>
function getByClass(oParent, sClass)
{
 var aEle=oParent.getElementsByTagName('*');
 var aResult=[];
 var re=new RegExp('\\b'+sClass+'\\b', 'i');
 var i=0;
 
 for(i=0;i<aEle.length;i++)
 {
  //if(aEle[i].className==sClass)
  //if(aEle[i].className.search(sClass)!=-1)
  if(re.test(aEle[i].className))
  {
   aResult.push(aEle[i]);
  }
 }
 
 return aResult;
}

window.οnlοad=function ()
{
 var oUl=document.getElementById('ul1');
 var aBox=getByClass(oUl, 'box');
 var i=0;
 
 for(i=0;i<aBox.length;i++)
 {
  aBox[i].style.background='red';
 }
};
</script>
</head>

<body>
<ul id="ul1">
 <li></li>
 <li class="box active"></li>
 <li class="box"></li>
 <li></li>
 <li></li>
 <li class="box"></li>
</ul>
</body>
</html>

转载于:https://www.cnblogs.com/leejersey/archive/2012/07/16/2593723.html

封装getByClass(JS获取class的方法封装为一个函数)相关推荐

  1. js获取url 参数方法封装

    js获取url 参数方法封装 // 获取url 参数getUrlParam(params) {let url = location.href;url = url.replace("?&quo ...

  2. js获取元素的方法与属性

    js获取元素的方法 可以使用内置对象document上的getElementById方法来获取页面上设置了id属性的元素,获取到的是一个html对象,然后将它赋值给一个变量 <scripttyp ...

  3. js获取id后添加html代码,js获取Id的方法getElementById与$的由来和用Id判断元素是否存在及批量动态获取 Id...

    要用js操作一个html元素必须获取到这个元素,而获取元素要用 getElementById() 方法,这个方法是通过元素的Id获取到元素这个对象.getElementById 字符比较多,写得比较长 ...

  4. 处理爬虫是返回setCookie的一段js获取acw_sc__v2的方法

    处理爬虫是返回setCookie的一段js获取acw_sc__v2的方法 原文链接: setCookie JS反爬虫处理 处理代码 import requests import re import b ...

  5. axios封装_VUE.JS请求工具Axios的封装

    接触vue已经很长时间,也经常使用axios,但是原生封装的方法都很难满足日程开发的需求,所以这期就写一下axios的封装. 作者:陈宝玉啊 转发链接:https://www.jianshu.com/ ...

  6. js获取对象的方法,根据id、根据name、根据标签名、根据类名

    正文 下面的代码中展示了常用的js获取html对象的方法,并且添加了详细的注释说明.快来看看吧. // 页面加载完毕以后再执行window.onload=function(){//1.根据id获取对象 ...

  7. js获取元素的方法及具体案例

    目录 1. 获取元素的方法 2.补充知识 3.具体案例:变色模块 1. 获取元素的方法 (1)通过id获取:document.getElementByid('id名') 例: <button i ...

  8. js获取根目录的方法

    最近做的项目希望能够在所有页面集成一个js,但是由于各文件目录不同,导致部分路径加载的不对,现写一js用来获取项目根目录: //js获取项目根路径,如: http://localhost:25531/ ...

  9. JS 获取元素内容方法

    获取DOM元素的方法有8种 通过ID获取(getElementById) 通过name属性(getElementsByName) 通过标签名(getElementsByTagName) 通过类名(ge ...

最新文章

  1. 字符串匹配shiftand算法
  2. matlab 图像函数以及运用(第十章)
  3. 【CyberSecurityLearning 61】文件上传
  4. 机器学习:AdaBoost算法及其实现
  5. 删除vs的调试其他软件的功能
  6. Tomcat和Weblogic的区别
  7. .NET连接MySQL数据库并绑定于datagridview。
  8. Webrct之demo运行
  9. 21.TCP/IP 详解卷1 --- TCP 的超时与重传
  10. mysql全库备份/增量备份脚本
  11. FineUI之使用SQL脚本从数据库表中生成对应的输入控件
  12. 时间序列分析-AR模型
  13. 为什么正常单据记账没有数据_正常单据记账中找不到记账单据
  14. 最新的省市区三级地区MySQL数据库,附带获取方法
  15. 贪心科技机器学习训练营(六)
  16. Discuz大气游戏风格模板/仿lol英雄联盟游戏DZ游戏模板GBK
  17. 实现当输入框为空时,按backspace键后执行相应操作(明确按键监听事件和文本框内容变化的内在逻辑)
  18. android 路由器,无线路由器上跑Android怎么样?
  19. c语言中ifelse意义,c语言if和else if的区别
  20. 阿里云GPU计算型实例规格族gn6i配置性能详解

热门文章

  1. mysql replication错误常见处理
  2. 在AD中恢复误删除的对象
  3. mysql多实例(mysqld_multi方式)
  4. Android JNI(Java Native Interface)技术介绍
  5. android 如何保留数据两位小数
  6. android string.xml中%1$s、%1$d等的用法
  7. Python几种加密算法
  8. JVM学习笔记之-对象的实例化,内存布局与访问定位,直接内存(Direct Memory)
  9. React路由 + 绝对路径引用
  10. 游戏编程入门之绘制动画的精灵(爆炸特效)