zoukankan      html  css  js  c++  java
  • js获取class

    ie不支持getElementsByClassName,所以要自己实现获取类名为className的所有元素。

     1 <html>
     2 <head>
     3 <script type="text/javascript">
     4 
     5 window.onload = function()
     6 {   var topMenus = getClass('li','topMenu');
     7     for(var i=0;i < topMenus.length; i++)
     8     {
     9         alert(topMenus[i].innerHTML);        
    10     }
    11 
    12 }
    13 
    14 function getClass(tagName,className) //获得标签名为tagName,类名className的元素
    15 {
    16     if(document.getElementsByClassName) //支持这个函数
    17     {        return document.getElementsByClassName(className);
    18     }
    19     else
    20     {       var tags=document.getElementsByTagName(tagName);//获取标签
    21         var tagArr=[];//用于返回类名为className的元素
    22         for(var i=0;i < tags.length; i++)
    23         {
    24             if(tags[i].class == className)
    25             {
    26                 tagArr[tagArr.length] = tags[i];//保存满足条件的元素
    27             }
    28         }
    29         return tagArr;
    30     }
    31 
    32 }
    33 
    34 
    35 
    36 </script>
    37 
    38 </head>
    39 <body>
    40 
    41 <ul id="nav">
    42 <li class="topMenu"><a href="#">产品介绍</a>
    43     <ul class="subMenu">
    44         <li><a href="#">产品1</a></li>
    45         <li><a href="#">产品2</a></li>
    46         <li><a href="#">产品3</a></li>
    47         <li><a href="#">产品4</a></li>
    48         <li><a href="#">产品5</a></li>
    49         <li><a href="#">产品6</a></li>
    50     </ul>
    51 </li>
    52 <li class="topMenu"><a href="#">服务介绍</a>
    53     <ul class="subMenu">
    54         <li><a href="#">服务1</a></li>
    55         <li><a href="#">服务2</a></li>
    56         <li><a href="#">服务3</a></li>
    57         <li><a href="#">服务4</a></li>        
    58     </ul>
    59 </li>
    60 <li class="topMenu"><a href="#">成功案例</a>
    61     <ul class="subMenu">
    62         <li><a href="#">案例1</a></li>
    63         <li><a href="#">案例2</a></li>
    64         <li><a href="#">案例3</a></li>
    65         <li><a href="#">案例4</a></li>
    66     </ul>
    67 </li>
    68 <li class="topMenu"><a href="#">关于我们</a>
    69     <ul class="subMenu">
    70         <li><a href="#">我们1</a></li>
    71         <li><a href="#">我们2</a></li>
    72         <li><a href="#">我们3</a></li>
    73         <li><a href="#">我们4</a></li>
    74     </ul>
    75 </li>
    76 <li class="topMenu"><a href="#">联系我们</a>
    77     <ul class="subMenu">
    78         <li><a href="#">联系1</a></li>
    79         <li><a href="#">联系2</a></li>
    80         <li><a href="#">联系3</a></li>
    81         <li><a href="#">联系4</a></li>
    82         <li><a href="#">联系5</a></li>
    83         <li><a href="#">联系6</a></li>
    84         <li><a href="#">联系7</a></li>
    85     </ul>
    86 </li>
    87 
    88 </ul>
    89 </body>
    90 </html>

    在程序里WebBrowser控件可以用下面的办法。

    function getstyle(sname) { 
    for (var i=0;i<document.styleSheets.length;i++) { 
    var rules; 
    if (document.styleSheets[i].cssRules) { 
    rules = document.styleSheets[i].cssRules; 
    } else { 
    rules = document.styleSheets[i].rules; 
    } 
    for (var j=0;j<rules.length;j++) { 
    if (rules[j].selectorText == sname) { 
    //selectorText 属性的作用是对一个选择的地址进行替换.意思应该是获取RULES[J]的CLASSNAME.有说错的地方欢迎指正 
    return rules[j].style; 
    } 
    } 
    } 
    } 
    
    
    getstyle(".top").display = "none"; 
  • 相关阅读:
    我今天能懂
    SpringMVC之RequestContextHolder分析
    idea只导入部分依赖
    idea中GitPush失败问题
    SpringBoot常用配置,引入外部配置文件信息,热加载
    idea的yml文件不识别问题
    SpringBoot介绍,快速入门小例子,目录结构,不同的启动方式,SpringBoot常用注解
    Java连接Redis,存储对象获取对象()byte和json),连接池
    Nginx的反向代理
    Nginx介绍,安装,配置
  • 原文地址:https://www.cnblogs.com/banbu/p/2968965.html
Copyright © 2011-2022 走看看