对于javascript中的getElementsByClassName 在IE 6/7/8 不支持问题。

那么须要模拟出getElementsByClassName  须要採用className属性,这里就涉及到javascript中的getAttribute问题。

在ie 6/7 中,对于getAttribute存在Bug

须要採用className 获取例如以下:

var node = document.getElementById("test");
var name = node.className;

对于标准浏览器,则能够直接使用className 也能够使用 getAttritbute,结果一样:

node.getAttritbute("class");

可是假设是ie 6/7 ,则getAttribute()存在问题。

所以getElementsByClassName 能够使用例如以下方式:

getElementsByClazzName = document.getElementsClassName ?
function(name){
return document.getElementsClassName(name);
}:function(name){
var nodes = document.getElementsByTagName("*"),
result = [];
for(var node in nodes){
if(node.className && node.className.indexOf(name)){
result.push(node);
}
}
return result;
}

这里的实现方式比較简单。

1:常规属性建议使用:node.xxx。

2:自己定义属性建议使用: node.getAttribute("xxxx")。

3:当获取的目标是 javascript 里的keyword时建议使用node.getAttribute("xxx")。如label中的for。

4:当获取的目标是保留字,如:class,请使用className取代。

[ javascript ] getElementsByClassName与className和getAttribute!的更多相关文章

  1. Javascript:getElementsByClassName

    背景: 由于原生的getElementsByClassName不支持在指定标签中查找指定元素为指定class的情况,所以,这里舍弃了原生的方法调用   方法一: function getElement ...

  2. javascript getElementsByClassName扩展函数

    代码: function getElementsByClassName(){ if(!arguments[0]){return []};//未指定任何参数,直接返回 var args=argument ...

  3. javascript中通过className灵活查找元素 例如我们要把根据class来进行修改样式

    一.背景:一个表单中,要修改一些li中有class=box的样式,将它的background设置为red红色.一般的做法是我们可以先找到父级元素 ,然后由父级元素找到所有相关tagName,最后,来一 ...

  4. document.getElementsByClassName() 原生方法 通过className 选择DOM节点

    <div id="box"> <div class="box">1</div> <div class="bo ...

  5. javascript 之 className属性

    Javascript 可以通过className 属性灵活的更改一个标签元素的CSS 类选择器来实现样式的变化. 1.用className 属性修改节点的css类别 代码如下: <html> ...

  6. 表单美化-原生javascript和jQuery多选按钮(兼容IE6)

    前些天我们讲了下单选按钮的美化今天来做表单元素多选按钮的美化.我们的想法是:利用多选按钮是否被选中和是否不给选择的特性来为按钮的父元素添加对应的样式,就是说用什么的样式是由按钮的状态来决定. 用到的图 ...

  7. javascript dom编程艺术笔记第三章:DOM操作的5个基本方法

    JavaScript的 DOM操作,主要是对DOM这三个字母中D.O.M的操作.D代表的是document(文档),即我们可以使用javascript对文档进行操作,O代表的是object(对象),对 ...

  8. JavaScript DOM详解

    欢迎转载,转载请标明出处: http://blog.csdn.net/johnny901114/article/details/52727448 本文出自:[余志强的博客] 一.DOM概述 D: Do ...

  9. javascript的一些常用知识点

    1. 查看你的html文档中一共有多少个节点 :   document.getElementsByTagName(" * ").length; 2.  document.getEl ...

随机推荐

  1. [Apple开发者帐户帮助]八、管理档案(2)创建临时配置文件(iOS,tvOS,watchOS)

    创建临时配置文件以在设备上运行您的应用程序而无需Xcode.在开始之前,您需要一个App ID,一个分发证书和多个注册设备. 有关完整的临时配置文件工作流程,请转到Xcode帮助中的分发到已注册设备( ...

  2. sql case when 用法

    sql语言中有没有类似C语言中的switch case的语句?? 没有,用case   when   来代替就行了.            例如,下面的语句显示中文年月         select  ...

  3. ACM_3n+1问题(克拉兹问题+线段树区间查询最大值)

    3n+1问题 Time Limit: 2000/1000ms (Java/Others) Problem Description: 考虑如下的序列生成算法:从整数n开始,如果n是偶数,把它除以2:如果 ...

  4. 题解报告:poj 3233 Matrix Power Series(矩阵快速幂)

    题目链接:http://poj.org/problem?id=3233 Description Given a n × n matrix A and a positive integer k, fin ...

  5. Laravel5.1学习笔记18 数据库4 数据填充

    简介 编写数据填充类 使用模型工厂类 调用额外填充类 执行填充 #简介 Laravel includes a simple method of seeding your database with t ...

  6. Android 自己搭建一个直播系统吧

    服务端用 SRS(Simple Rtmp Server),在这里下载simple-rtmp-server需要Linux系统最好是Ubuntu,装个Ubuntu虚拟机就行了在Linux里,解压缩SRS ...

  7. [Android]异常2-Unexpected error while executing

    异常原因: 可能一>Android Studio的自动编译没有成功 解决方法有: 解决一>菜单栏里的“Build”,“Clean Project” 注:

  8. Listview模板

    每次写listview都要翻以前的代码,好烦.所以记下模板,方便下次的使用. xml文件部分代码: <ListView android:id="@+id/listview" ...

  9. CUDA-GPU编程

    参考:http://blog.csdn.net/augusdi/article/details/12833235  第二节 新建NVIDIA项目: 新建项目及会生成一个简单的代码demo,计算矩阵的加 ...

  10. JS——select标签

    <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...