[ javascript ] getElementsByClassName与className和getAttribute!
对于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!的更多相关文章
- Javascript:getElementsByClassName
背景: 由于原生的getElementsByClassName不支持在指定标签中查找指定元素为指定class的情况,所以,这里舍弃了原生的方法调用 方法一: function getElement ...
- javascript getElementsByClassName扩展函数
代码: function getElementsByClassName(){ if(!arguments[0]){return []};//未指定任何参数,直接返回 var args=argument ...
- javascript中通过className灵活查找元素 例如我们要把根据class来进行修改样式
一.背景:一个表单中,要修改一些li中有class=box的样式,将它的background设置为red红色.一般的做法是我们可以先找到父级元素 ,然后由父级元素找到所有相关tagName,最后,来一 ...
- document.getElementsByClassName() 原生方法 通过className 选择DOM节点
<div id="box"> <div class="box">1</div> <div class="bo ...
- javascript 之 className属性
Javascript 可以通过className 属性灵活的更改一个标签元素的CSS 类选择器来实现样式的变化. 1.用className 属性修改节点的css类别 代码如下: <html> ...
- 表单美化-原生javascript和jQuery多选按钮(兼容IE6)
前些天我们讲了下单选按钮的美化今天来做表单元素多选按钮的美化.我们的想法是:利用多选按钮是否被选中和是否不给选择的特性来为按钮的父元素添加对应的样式,就是说用什么的样式是由按钮的状态来决定. 用到的图 ...
- javascript dom编程艺术笔记第三章:DOM操作的5个基本方法
JavaScript的 DOM操作,主要是对DOM这三个字母中D.O.M的操作.D代表的是document(文档),即我们可以使用javascript对文档进行操作,O代表的是object(对象),对 ...
- JavaScript DOM详解
欢迎转载,转载请标明出处: http://blog.csdn.net/johnny901114/article/details/52727448 本文出自:[余志强的博客] 一.DOM概述 D: Do ...
- javascript的一些常用知识点
1. 查看你的html文档中一共有多少个节点 : document.getElementsByTagName(" * ").length; 2. document.getEl ...
随机推荐
- Django day26 HyperlinkedIdentityField,序列化组件的数据校验以及功能的(全局,局部)钩子函数,序列化组件的反序列化和保存
一:HyperlinkedIdentityField(用的很少):传三个参数:第一个路由名字,用来反向解析,第二个参数是要反向解析的参数值,第三个参数:有名分组的名字 -1 publish = ser ...
- Java根据年度将数据分组
现在有这么一组数据 code name year 45615654 x1 ...
- 【洛谷2904/BZOJ1617】[USACO08MAR]跨河River Crossing(动态规划)
题目:洛谷2904 分析: 裸dp-- dp方程也不难想: \(dp[i]\)表示运\(i\)头牛需要的最短时间,\(sum[i]\)表示一次运\(i\)头牛(往返)所需的时间,则 \[dp[i]=m ...
- 【Leetcode】84. Largest Rectangle in Histogram 85. Maximal Rectangle
问题描述: 84:直方图最大面积. 85:0,1矩阵最大全1子矩阵面积. 问题分析: 对于84,如果高度递增的话,那么OK没有问题,不断添加到栈里,最后一起算面积(当然,面积等于高度h * disPo ...
- 单例模式在多线程环境下的lazy模式为什么要加两个if(instance==null)
刚才在看阿寻的博客”C#设计模式学习笔记-单例模式“时,发现了评论里有几个人在问单例模式在多线程环境下为什么lazy模式要加两个if进行判断,评论中的一个哥们剑过不留痕,给他们写了一个demo来告诉他 ...
- CF832B Petya and Exam
思路: 模拟. 实现: #include <iostream> using namespace std; string a, b; ]; bool solve() { ) return f ...
- 如何用putty链接服务器端,并安装wdcp
首先把自己阿里云的磁盘格式化然后重启 自己下载一个PuTTY 打开后输入自己的Ip地址端口号默认是22 会跳出一个yes 跟no界面,点击yes 会进入一个类似cmd界面 直接输入root,然后会提示 ...
- ddrmenu
<%@ Register TagPrefix="dnn" TagName="MENU" Src="~/DesktopModules/DDRMen ...
- Spring学习笔记_day01_ioc
本文为博主辛苦总结,希望自己以后返回来看的时候理解更深刻,也希望可以起到帮助初学者的作用. 转载请注明 出自 : luogg的博客园 谢谢配合! Spring_day01 spring是一站式的框架, ...
- Java并发——阿里架构师是如何巧用线程池的!
一.创建线程 1.创建普通对象,只是在JVM的堆里分配一块内存而已 2.创建线程,需要调用操作系统内核的API,然后操作系统需要为线程分配一系列资源,成本很高 线程是一个重量级对象,应该避免频繁创建和 ...