封装自己的class类，实现浏览器兼容。

 <!DOCTYPE html>

 <html lang="en">

 <head>

     <meta charset="UTF-8">

     <title>封装自己的class类</title>

     <style>

         div{

             width: 200px;

             height: 200px;

             background: pink;

             margin:10px;

         }

     </style>

     <script>

         window.onload=function(){

             //封装自己的class类名

             function getClass(classname,id) {

                 //如果浏览器支持，则直接返回

                 if(document.getElementsByClassName){

                     //有id

                     if(id){

                         var eleId=document.getElementById(id);

                         return eleId.getElementsByClassName(classname);

                     }else{//没有id的情况

                         return document.getElementsByClassName(classname);

                     }

                 }

                 //不支持的情况

                 if(id){

                     var eleId=document.getElementById(id);

                     var dom=eleId.getElementsByTagName("*");

                 }else{

                     var dom=document.getElementsByTagName("*");

                 }

                     var arr=[];

                     for(var i=0;i<dom.length;i++){

                         var txtarr=dom[i].className.split(" ");

                         for(var j=0;j<txtarr.length;j++){

                             if(txtarr[j]==classname){

                                 arr.push(dom[i]);

                             }

                         }

                     }

                 return arr;

             }

             //console.log(getClass("test","one").length);

             //测试

             /*var aa=getClass("test","one");

             for(var i=0;i<aa.length;i++){

                 aa[i].style.backgroundColor="blue";

             }*/

         }

     </script>

 </head>

 <body>

 <div class="test" ></div>

 <div class="demo"></div>

 <div class=" demo test"></div>

 <div id="one">

     <div class="demo test"></div>

     <div class=" test"></div>

     <div class="demo test"></div>

 </div>

 <div></div>

 </body>

 </html>

第33天：封装自己的class类的更多相关文章

  1. Android RecyclerView单击、长按事件:基于OnItemTouchListener +GestureDetector标准实现（二），封装抽取成通用工具类

     Android RecyclerView单击.长按事件:基于OnItemTouchListener +GestureDetector标准实现(二),封装抽取成通用工具类 我写的附录文章2,介绍了 ...

  2. Redis操作Hash工具类封装，Redis工具类封装

    Redis操作Hash工具类封装,Redis工具类封装 >>>>>>>>>>>>>>>>>> ...

  3. Redis操作字符串工具类封装，Redis工具类封装

    Redis操作字符串工具类封装,Redis工具类封装 >>>>>>>>>>>>>>>>>>& ...

  4. 【Android】19.3 ContentProvider及安卓进一步封装后的相关类

    分类:C#.Android.VS2015: 创建日期:2016-03-08 一.简介 ContentProvider:内容提供程序. Android的ContentProvider与.NET框架的EF ...

  5. SpringMVC 中，当前台传入多个参数时，可将参数封装成一个bean类

    在实际业务场景中,当前台通过 url 向后台传送多个参数时,可以将参数封装成一个bean类,在bean类中对各个参数进行非空,默认值等的设置. 前台 url ,想后台传送两个参数,userName 和 ...

  6. Python_selenium封装一个浏览器引擎类

    Python_selenium封装一个浏览器引擎类 现在我们在编写一个类,叫浏览器引擎类(此例为:启动浏览器),将文件名命名为browser.py,代码下面通过更改一个字符串的值,运用if语句判断和控 ...

  7. python接口自动化（三十五）-封装与调用--流程类接口关联（详解）

    简介 流程相关的接口,主要用 session 关联,如果写成函数(如上篇),s 参数每个函数都要带,每个函数多个参数,这时候封装成类会更方便.在这里我们还是以博客园为例,带着小伙伴们实践一下. 接口封 ...

  8. 简单封装 Delphi 的 DirectX类

    var CreatorRenderer  : TCreatorRenderer; Form1: TForm1; 窗体代码: {$R *.dfm} procedure TForm1.FormCreate ...

  9. 免费IP代理池定时维护，封装通用爬虫工具类每次随机更新IP代理池跟UserAgent池，并制作简易流量爬虫

    前言 我们之前的爬虫都是模拟成浏览器后直接爬取,并没有动态设置IP代理以及UserAgent标识,本文记录免费IP代理池定时维护,封装通用爬虫工具类每次随机更新IP代理池跟UserAgent池,并制作 ...

随机推荐

  1. struts2学习笔记四

    一.contextMap中的数据操作 root根:List 元素1 元素2 元素3 元素4 元素5 contextMap:Map key value application Map key value ...

  2. 20145234黄斐《Java程序设计》第五周学习总结

    教材学习内容总结 第八章 异常处理 语法与继承架构 try.catch:try.catch代表错误的对象后做一些处理. 异常继承架构:错误会被包装为对象,这些对象均可抛出,因此设计错误对象都继承自ja ...

  3. 武汉Uber优步司机奖励政策(8月31日~9月6日)

    ·奖励前提 *必须满足当周平均评分4.7星及以上,且当周接单率70%及以上,当周在线5小时且完成5单,才有资格获得奖励 * 各组别必须满足当周要求的成单率才有资格获得奖励,成单率由当周 滴滴快车单单2 ...

  4. 苏州Uber优步司机奖励政策（12月14日到12月20日）

    滴快车单单2.5倍,注册地址:http://www.udache.com/ 如何注册Uber司机(全国版最新最详细注册流程)/月入2万/不用抢单:http://www.cnblogs.com/mfry ...

  5. Qt的4个图像类QImage/QPixmap/QBitmap/QPicture 转

    Qt的4个图像类QImage/QPixmap/QBitmap/QPicture 转 (一)QPixmap和QImage的区别 http://www.thisisqt.com/forum/viewthr ...

  6. jmeter基础之录制篇

    一.前言 jmeter如今被越来越多人喜爱的一款测试工具,相比于loadrunner它体积特轻便.jmeter不仅用来做单接口测试,压测还能做性能,主要是一款开源的,可以写一个你需要的插件功能再添加里 ...

  7. Linux命令应用大词典-第41章 MySQL数据库

    41.1 mysqld_safe:MySQL服务器启动脚本 41.2 mysql_install_db:初始化MySQL数据目录 41.3 mysqlshow:显示MySQL数据库结构 41.4 my ...

  8. ConfigHelpers

    --默认值可以不传 local ConfigHelpers = {} --设置物体高亮 target:设置对象 isLigth:是否高亮 seeThrough:是否穿透(默认为true,穿透) sta ...

  9. Zookeeper与Eureka的区别

    Zookeeper与Eureka的区别 想要了解Zk与eureka的区别首先要知道CAP定理 CAP定理 Mysql强一致性(数据唯一出处),设计数据库设计的三范式 (表必须有主键:表不能有重复的列: ...

  10. 【CSVRead】-jmeter

    csv     read 读取文件