通过Class获取标签，兼容的几种思路
在js中通过document.getElementsByClassName()在低版本IE浏览器中不兼容。然后我写了几种方案，大家可以参考参考。
html代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<p>1</p>
<p>2</p>
<p class=" r aaa">3</p>
<p>4</p>
<p class="aaa">5</p>
<p>6</p>
<p>7</p>
<p>8</p>
<p>9</p>
</body>
</html>
js代码
<script>
// 方案1 ：正则
function getClass(className){
// 获取所有标签
var lis = document.getElementsByTagName('*');
// 保存过滤后的标签
var arr = [];
for(var i=0;i<lis.length;i++){
// 创建正则，通过正则的test方法判断当前元素的class中是否存在正则中的内容，返回一个true或者false
if(new RegExp(className).test(lis[i].className)){
// 如果有则添加到arr中
arr.push(lis[i]);
}
}
// 返回过滤后的数组。
return arr;
}
// 方案2 ：利用字符串的indexOf判断 找不到返回-1
function getClass1(className){
// 获取所有元素
var lis = document.getElementsByTagName('*');
// 保存过滤后的数组
var arr = [];
for(var i=0;i<lis.length;i++){
// 判断所有标签的class有没有我们想要的
if(lis[i].className.indexOf(className)!=-1){
// 添加到新数组
arr.push(lis[i]);
}
}
// 返回
return arr;
}
console.log(getClass('aaa'));
// [p.r.aaa, p.aaa]
console.log(getClass1('aaa'));
// [p.r.aaa, p.aaa]
</script>
还可以将获取到的class转换成数组，然后挨个判断，不过这样反而更麻烦了。
建议通过父级再通过*获取元素，性能会好一些。
唉，感觉自己写新手慢慢的看不懂了，也许真的是自己进步了吧，不知道是高兴还是悲伤。
通过Class获取标签，兼容的几种思路的更多相关文章
- selenium定位方式-获取标签元素：find_element_by_xxx
定位方式取舍# 唯一定位方式.多属性定位.层级+角标定位(离目标元素越近,相对定位越好) # 推荐用css selector(很少用递进层次的定位)# 什么时候用xpath呢? 当你定位元素时,必须要 ...
- Java获取ip地址的几种方法
以下内容介绍下java获取ip地址的几种思路. 1.直接利用java.net.InetAddress类获取,不过这种方法只在windows环境下有效,在linux环境下只能获取localhost地址( ...
- JS获取标签方法及兼容处理
document.getElementById('Id名'); // 所有浏览器 document.getElementsByTagName('标签名'); // 所有浏览器 document.ge ...
- java：JavaScript2：（setTimeout定时器，history.go()前进/后退，navigator.userAgent判断浏览器，location.href，五种方法获取标签属性，setAttribute，innerHTML，三种方法获取form表单信息，JS表单验证，DOM对象，form表单操作）
1.open,setTimeout,setInterval,clearInterval,clearTimeout <!DOCTYPE> <html> <head> ...
- jquery获取标签内容，编辑内容
一.获取页面元素 三种方式获取页面中元素的内容. input标签使用:.val()获取 标签下的html及文本内容:.html() 仅获取标签下的纯文本内容:.text() <head> ...
- JS---DOM---设置和获取---标签内容和文本内容
设置和获取---标签内容和文本内容 总结---设置: 使用innerText主要是设置文本的, 设置标签内容, 是没有标签的效果的 innerHTML是可以设置文本内容 innerHTML主要的作 ...
- windows下获取IP地址的两种方法
windows下获取IP地址的两种方法: 一种可以获取IPv4和IPv6,但是需要WSAStartup: 一种只能取到IPv4,但是不需要WSAStartup: 如下: 方法一:(可以获取IPv4和I ...
- Java中获取键盘输入值的三种方法
Java中获取键盘输入值的三种方法 Java程序开发过程中,需要从键盘获取输入值是常有的事,但Java它偏偏就没有像c语言给我们提供的scanf(),C++给我们提供的cin()获取键盘输入值 ...
- php获取post参数的几种方式 RPC 规定接收取值方式 $GLOBALS['HTTP_RAW_POST_DATA'];
http://www.cnblogs.com/zhepama/p/4022606.html PHP默认识别的数据类型是application/x-www.form-urlencoded标准的数据类型. ...
随机推荐
- jboss 7 启动问题
19:30:50,176 INFO [org.jboss.modules] JBoss Modules version 1.1.1.GA19:30:50,458 INFO [org.jboss.msc ...
- centos 6.X minimal 系列最小化安装完成后,安装mono和jexus过程小记录
在使用虚拟机安装minimal版centos运行mono+jexus的时候,遇到了一些坑,记录一下,比如虚拟机访问不了网络,没wget命令没开放80端口,等等小问题,其他网上教程已经有mono+jex ...
- 微信公众号 扫码支付 模式二 demo
扫码支付 本文附有代码,在下方,如果不熟悉场景的可以看看下面的场景介绍 场景介绍 官网介绍地址:https://pay.weixin.qq.com/wiki/doc/api/native.php?ch ...
- 工作当中实际运用（2）——js原生实现全选/反选
老规矩 直接上代码 代码中详细注释: function checkAll(){ var alls=document.getElementById('tab-stp').getElementsByTa ...
- 转载：oracle null处理
(1)NULL的基础概念,NULL的操作的基本特点NULL是数据库中特有的数据类型,当一条记录的某个列为NULL,则表示这个列的值是未知的.是不确定的.既然是未知的,就有无数种的可能性.因此,NULL ...
- QC11客户端安装
win10使用hp qc11 步骤1:安装vcredist_x86,32位 步骤2:安装浏览器客户端 ALMExplorerAddIn,11版本 可能遇到的问题 1. 出现Initialization ...
- MyEclipse 常用操作
1.使用JREBEL插件包实现myeclipse修改类文件后无须重启 在Myeclipse中的window-preferences(搜索tomcat)->然后到tomcatx.x下的-jdk中配 ...
- Android性能优化典范第二季
Google前几天刚发布了Android性能优化典范第2季的课程,一共20个短视频,包括的内容大致有:电量优化,网络优化,Wear上如何做优化,使用对象池来提高效率,LRU Cache,Bitma ...
- 使用Ivy管理项目中的依赖
Ivy是什么 Ivy是一个跟踪管理项目直接以来关系的工具.Ivy具有良好的灵活性和可配置性,使其可以适应各种不同的依赖管理和构建过程要求:虽然Ivy作为依赖管理工具,其可以与Apache Ant进行紧 ...
- 【C语言学习】《C Primer Plus》第12章 存储类、链接和内存管理
学习总结 1.作用域可分为代码块作用域.函数原型作用域或者文件作用域. 代码块作用域例子: { for(int i=0;i<10;i++){ //C99允许 … //i的作用域 } ... ...