封装自己的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. Lingo解决最优化问题

    目录 Lingo解决优化问题 前言 一.优化模型介绍 二.运输问题 2.1 问题描述 2.2 问题分析 2.2 优化模型构建 2.3 模型求解 2.4 求解结果 三.待更新 Lingo解决优化问题 @ ...

  2. python--模块之re正则表达式

    简介: 正则表达式本身是一个小型的.高度专业化的编程语言,而在python中,通过内嵌集成re模块,我们可以通过直接调用来实现正则匹配. 正则表达式基础知识: --普通字符匹配自身 abc ----a ...

  3. WPF Prism MVVM 中 弹出新窗体. 放入用户控件

    原文:WPF Prism MVVM 中 弹出新窗体. 放入用户控件 版权声明:本文为博主原创文章,未经博主允许不得转载. https://blog.csdn.net/qq_37214567/artic ...

  4. nodejs HTTP服务

    nodejs中的HTTP服务   nodejs最重要的方面之一是具有非常迅速的实现HTTP和HTTPS服务器和服务的能力.http服务是相当低层次的,你可能要用到不同的模块,如express来实现完整 ...

  5. linux-centos6②

  6. Selenium（Python）调用pywin32上传图片

    import unittestfrom time import sleep import osfrom selenium import webdriverimport win32apiimport w ...

  7. （C#）原型模式—深复制与浅复制

    1.原型模式 用原型实例指定创建对象的实例,并且通过拷贝这些原型创建新的对象. *原型模式隐藏了创建对象的细节,提高了性能. *浅复制:被复制对象的所有变量都含有与原来对象相同的值,而且所有对其他对象 ...

  8. 完整的正则表达式知识汇总（Python知识不断更新）

    ## 大纲: ## 一.正则概述 1.正则是什么 正则就是一套规则,或者语法 2.正则的作用 让我们判断是否符合我们的的规则,或者根据规则找到符合规则的数据 3.使用场景 可以用正则判断我们输入的邮箱 ...

  9. [SHELL]linux环境变量

  10. 单词 （Play on Words UVA - 10129 ）

    题目描述: 原题:https://vjudge.net/problem/UVA-10129 题目思路: 1.明显是判断欧拉路径 2.欧拉路径的两个条件 a.图连通 b.至多为两个奇点,且一个为起点一个 ...