javascript获取类元素
代码测试是ie5+；
原生javascript中筛选出含有指定类的元素；
思想：在指定范围里把所有的元素筛选出来，然后把里面的每个元素都遍历找出它们含有的所有类，然后逐个元素遍历它们各自的类，如果指定的类和它们里面的类相等，那么就把这个元素放进一个数组中然后返回这个数组。
<span style="font-size:18px;"><!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript">
function getClassName(classname,idbox){ /*创建一个函数，可以传入两个参数，指定选择的类，指定选择类的范围*/
var box=document.getElementById(idbox); //获取ID为第二个参数的元素
var cbox=box || document; //检测box是否存在（否有传入第二个参数），如果不存在则把document赋予变量cbox（确定指定类的父容器即类的范围）如果有则在指定的容器中寻找类，如果没有则在整个文档中寻找。
var cbox_elem=cbox.getElementsByTagName('*'); //获取指定容器或页面中所有元素
var ctag=new Array(); /*创建一个空数组用来后面放置含有指定类的元素*/
for(var i=0;i<cbox_elem.length;i++){ /*遍历容器中的所有元素*/
var cur_else=cbox_elem[i]; /*把当前遍历的元素赋值给变量cur_else*/
var classnames=cur_else.className.split(' ');
/*把当前遍历的元素中的所有类用空格分开成一个数组并赋值给变量classnames*/
for(var j=0;j<classnames.length;j++){ /*遍历当前元素中里的每个类*/
if(classnames[j]==classname){ /*当前遍历中的类和第一个参数是否相等*/
ctag.push(cur_else); /*相等则把拥有该类的元素添加到先前创建好的数组中*/
break; /*退出这个类循环直接跳到外层元素for语句*/
}
}
}
return ctag; /*把数组返回给调用的代码，这里把数组返回给变量all_li*/
}
window.onload=function(){
var all_li=getClassName("pp","y");
alert(all_li.length)
}
</script>
</head>
<body>
<!-- 兼容IE5+ -->
<ul id="y">
<li class="pp uu"></li>
<li class="pp"></li>
<li class="pp"></li>
<li ></li>
<li ></li>
</ul>
</body>
</html></span>
知识点学习
JavaScript中的obj.split(a,b) 方法
用于把一个字符串分割成字符串数组。
该方法有两个参数：
a:必需。字符串或者正则表达，用来指定分割的地方。
b:可选。指定返回数组的最大长度，返回指定个数的数组。
javascript获取类元素的更多相关文章
- JavaScript获取html元素的实际宽度和高度
一.JavaScript获取html元素宽高 1.宽高都写在样式表里,就比如#div1{width:120px;}.这中情况通过#div1.style.width拿不到宽度,而通过#div1.offs ...
- 用javaScript获取页面元素值
用JavaScript获取页面元素常见的三种方法: getElementById() ...
- javascript 获取iframe元素的方法
javascript 获取iframe元素的方法 第一种: $("#IframeID").contents().find("div"); 第二种: $(win ...
- 用Javascript获取页面元素的位置
制作网页的过程中,你有时候需要知道某个元素在网页上的确切位置. 下面的教程总结了Javascript在网页定位方面的相关知识. 一.网页的大小和浏览器窗口的大小 首先,要明确两个基本概念. 一张网页的 ...
- JavaScript获取页面元素的常用方法
1.通过标签获取元素,返回一个数组 var li = document.getElementsByTagName('li');//标签获取元素 li[0].innerHTML;// 查看获取元素的内容 ...
- Javascript获取html元素的几种方法
1.通过id获取html元素 <!DOCTYPE html> <html> <head lang="en"> <meta charset= ...
- Javascript获取页面元素相对和绝对位置
制作网页的过程中,你有时候需要知道某个元素在网页上的确切位置. 下面的教程总结了Javascript在网页定位方面的相关知识. 一.网页的大小和浏览器窗口的大小 首先,要明确两个基本概念. 一张网页的 ...
- 使用JavaScript获取select元素选中的value和text
示例代码如下(js直接写在了html里面,没有写在一个单独的外部文件中): <!DOCTYPE html> <html> <head> <meta name= ...
- JavaScript获取HTML元素样式的方法（style、currentStyle、getComputedStyle）
一.style.currentStyle.getComputedStyle的区别 style只能获取元素的内联样式,内部样式和外部样式使用style是获取不到的. currentStyle可以弥补st ...
随机推荐
- php socket通信(tcp/udp)
注意 1.在socket_bind的时候ip地址不能真回环地址如127.0.0.1 2.server.php后台跑起来的时候 nohup php server.php > /var/tmp/a. ...
- 6.shap以及selector的使用
功能:相当于自定义一个模板 首先,要新建一个drawble文件夹 然后,再新建一个XML文件 在<shap></shap>中写内容 <corners/>圆角 < ...
- Unity GUI内绘制贝塞尔曲线
用Handles可以直接在GUI下绘制贝塞尔 using UnityEditor; using UnityEngine; using System.Collections; public class ...
- 【TCP】超时与重传
在TCP连接中假设发送方一开始便向网络发送多个报文段,直到达到接收方通告的窗口大小为止.当发送方和接收方处于同一个区域网段时,这种方式是可以的.但是如果发送方和接收方之间存在多个路由器和速率较慢的链路 ...
- Linux平台下线程池的原理及实现
转自:http://blog.csdn.net/lmh12506/article/details/7753952 前段时间在github上开了个库,准备实现自己的线程池的,因为换工作的事,一直也没有实 ...
- drivers/mfd/Mfd-core.c
mfd: multifunction device drivers---多功能设备驱动开发:A product or device that has multiple functions. An ex ...
- OBD芯片应用开发手册 OBD2开发 内部资料分享 汽车电子通讯开发TDA61 TDA66芯片
OBD产品及各种汽车电子相关的开发.往往需要开发者学习各种汽车协议,深入了解全部OBD规范和汽车各性能参数.这往往需要开发者很长的时间学习研究,大大延缓了OBD产品的上市开发进度.为此深圳芯方案电子公 ...
- C#之桶中取黑白球问题
<编程之美>284页,问题4.6:桶中取黑白球. 有一个桶,里面有白球.黑球各100个,人们必须按照以下规则把球取出来: 1. 每次从桶中拿两个球: 2. 如果两球同色,再放入一个黑球: ...
- 机器人走方格 V3
1120 . 机器人走方格 V3 基准时间限制:1 秒 空间限制:65536 KB 分值: 160 N * N的方格,从左上到右下画一条线.一个机器人从左上走到右下,只能向右或向下走.并要求只能在 ...
- OS开发(Objective-C)常用库索引
code4app.com 这网站不错,收集各种 iOS App 开发可以用到的代码示例 cocoacontrols.com/ 英文版本的lib收集 objclibs.com/ 精品lib的收集网站 h ...