封装getByClass(JS获取class的方法封装为一个函数)
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的方法封装为一个函数)相关推荐
- js获取url 参数方法封装
js获取url 参数方法封装 // 获取url 参数getUrlParam(params) {let url = location.href;url = url.replace("?&quo ...
- js获取元素的方法与属性
js获取元素的方法 可以使用内置对象document上的getElementById方法来获取页面上设置了id属性的元素,获取到的是一个html对象,然后将它赋值给一个变量 <scripttyp ...
- js获取id后添加html代码,js获取Id的方法getElementById与$的由来和用Id判断元素是否存在及批量动态获取 Id...
要用js操作一个html元素必须获取到这个元素,而获取元素要用 getElementById() 方法,这个方法是通过元素的Id获取到元素这个对象.getElementById 字符比较多,写得比较长 ...
- 处理爬虫是返回setCookie的一段js获取acw_sc__v2的方法
处理爬虫是返回setCookie的一段js获取acw_sc__v2的方法 原文链接: setCookie JS反爬虫处理 处理代码 import requests import re import b ...
- axios封装_VUE.JS请求工具Axios的封装
接触vue已经很长时间,也经常使用axios,但是原生封装的方法都很难满足日程开发的需求,所以这期就写一下axios的封装. 作者:陈宝玉啊 转发链接:https://www.jianshu.com/ ...
- js获取对象的方法,根据id、根据name、根据标签名、根据类名
正文 下面的代码中展示了常用的js获取html对象的方法,并且添加了详细的注释说明.快来看看吧. // 页面加载完毕以后再执行window.onload=function(){//1.根据id获取对象 ...
- js获取元素的方法及具体案例
目录 1. 获取元素的方法 2.补充知识 3.具体案例:变色模块 1. 获取元素的方法 (1)通过id获取:document.getElementByid('id名') 例: <button i ...
- js获取根目录的方法
最近做的项目希望能够在所有页面集成一个js,但是由于各文件目录不同,导致部分路径加载的不对,现写一js用来获取项目根目录: //js获取项目根路径,如: http://localhost:25531/ ...
- JS 获取元素内容方法
获取DOM元素的方法有8种 通过ID获取(getElementById) 通过name属性(getElementsByName) 通过标签名(getElementsByTagName) 通过类名(ge ...
最新文章
- 字符串匹配shiftand算法
- matlab 图像函数以及运用(第十章)
- 【CyberSecurityLearning 61】文件上传
- 机器学习:AdaBoost算法及其实现
- 删除vs的调试其他软件的功能
- Tomcat和Weblogic的区别
- .NET连接MySQL数据库并绑定于datagridview。
- Webrct之demo运行
- 21.TCP/IP 详解卷1 --- TCP 的超时与重传
- mysql全库备份/增量备份脚本
- FineUI之使用SQL脚本从数据库表中生成对应的输入控件
- 时间序列分析-AR模型
- 为什么正常单据记账没有数据_正常单据记账中找不到记账单据
- 最新的省市区三级地区MySQL数据库,附带获取方法
- 贪心科技机器学习训练营(六)
- Discuz大气游戏风格模板/仿lol英雄联盟游戏DZ游戏模板GBK
- 实现当输入框为空时,按backspace键后执行相应操作(明确按键监听事件和文本框内容变化的内在逻辑)
- android 路由器,无线路由器上跑Android怎么样?
- c语言中ifelse意义,c语言if和else if的区别
- 阿里云GPU计算型实例规格族gn6i配置性能详解
热门文章
- mysql replication错误常见处理
- 在AD中恢复误删除的对象
- mysql多实例(mysqld_multi方式)
- Android JNI(Java Native Interface)技术介绍
- android 如何保留数据两位小数
- android string.xml中%1$s、%1$d等的用法
- Python几种加密算法
- JVM学习笔记之-对象的实例化,内存布局与访问定位,直接内存(Direct Memory)
- React路由 + 绝对路径引用
- 游戏编程入门之绘制动画的精灵(爆炸特效)