代码测试是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获取类元素的更多相关文章

  1. JavaScript获取html元素的实际宽度和高度

    一.JavaScript获取html元素宽高 1.宽高都写在样式表里,就比如#div1{width:120px;}.这中情况通过#div1.style.width拿不到宽度,而通过#div1.offs ...

  2. 用javaScript获取页面元素值

    用JavaScript获取页面元素常见的三种方法:                                                           getElementById() ...

  3. javascript 获取iframe元素的方法

    javascript  获取iframe元素的方法 第一种: $("#IframeID").contents().find("div"); 第二种: $(win ...

  4. 用Javascript获取页面元素的位置

    制作网页的过程中,你有时候需要知道某个元素在网页上的确切位置. 下面的教程总结了Javascript在网页定位方面的相关知识. 一.网页的大小和浏览器窗口的大小 首先,要明确两个基本概念. 一张网页的 ...

  5. JavaScript获取页面元素的常用方法

    1.通过标签获取元素,返回一个数组 var li = document.getElementsByTagName('li');//标签获取元素 li[0].innerHTML;// 查看获取元素的内容 ...

  6. Javascript获取html元素的几种方法

    1.通过id获取html元素 <!DOCTYPE html> <html> <head lang="en"> <meta charset= ...

  7. Javascript获取页面元素相对和绝对位置

    制作网页的过程中,你有时候需要知道某个元素在网页上的确切位置. 下面的教程总结了Javascript在网页定位方面的相关知识. 一.网页的大小和浏览器窗口的大小 首先,要明确两个基本概念. 一张网页的 ...

  8. 使用JavaScript获取select元素选中的value和text

    示例代码如下(js直接写在了html里面,没有写在一个单独的外部文件中): <!DOCTYPE html> <html> <head> <meta name= ...

  9. JavaScript获取HTML元素样式的方法（style、currentStyle、getComputedStyle）

    一.style.currentStyle.getComputedStyle的区别 style只能获取元素的内联样式,内部样式和外部样式使用style是获取不到的. currentStyle可以弥补st ...

随机推荐

  1. iptables禁止端口和开放端口

    1.关闭所有的 INPUT FORWARD OUTPUT 只对某些端口开放. 下面是命令实现: iptables -P INPUT DROP iptables -P FORWARD DROP ipta ...

  2. Runloop应用实例

    AFNetworking AFURLConnectionOperation 这个类是基于 NSURLConnection 构建的,其希望能在后台线程接收 Delegate 回调.为此 AFNetwor ...

  3. Windows下打包Python的exe可执行文件

    参考:http://www.cnblogs.com/Lands-ljk/p/5447723.html

  4. OA系统如何使用考勤机数据

    通达OA系统使用考勤机数据目前有两种方法可以实现:一种是通过进行二次开发,将通达OA系统与考勤机结合起来使用:另一种是通过将考勤机的数据导出再导入OA系统中.进行二次开发的话,需要和定制开发工程师联系 ...

  5. Encoding 分类： HDU 2015-06-25 21:56 9人阅读 评论(0) 收藏

    Encoding Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others) Total Subm ...

  6. JAVA基础知识之IO——Java IO体系及常用类

    Java IO体系 个人觉得可以用"字节流操作类和字符流操作类组成了Java IO体系"来高度概括Java IO体系. 借用几张网络图片来说明(图片来自 http://blog.c ...

  7. Python网络爬虫Scrapy框架研究 以及 代理设置

    地址:https://github.com/yidao620c/core-scrapy 例子:https://github.com/geekan/scrapy-examples 中文翻译文档: htt ...

  8. php四种基础算法：冒泡，选择，插入和快速排序法

    转自:http://www.php100.com/html/php/rumen/2013/1029/6333.html 许多人都说 算法是程序的核心,一个程序的好于差,关键是这个程序算法的优劣.作为一 ...

  9. poj3349

    http://poj.org/problem?id=3349 每个雪花都有六个分支,用六个整数代表,这六个整数是从任意一个分支开始,朝顺时针或逆时针方向遍历得到的.输入多个雪花,判断是否有形状一致的雪 ...

  10. flume ng之TailSource

    在它里面自带了一个TailSource以及TailDirSource,这个Source是负责读取一个文件,并一行一行的发送到sink端,而在flume-ng 1.4.0里面没有自带TailSource ...