[ 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 ...
随机推荐
- 开启和安装Kubernetes 基于Docker For Windows
0.最近发现,Docker For Windows Stable在Enable Kubernetes这个问题上是有Bug的,建议切换到Edge版本,并且采用下文AliyunContainerServi ...
- C# 截取字符串——
string strID ="NODE_aSDFghsdfgyuhjidfgh_45678" //得到_ 中间的数 int index = strID.IndexOf(" ...
- Aspose Cells dll 实现数据简单下载
Workbook workbook = new Workbook(); //工作簿 Worksheet sheet = workbook.Worksheets[ ...
- 题解报告:hdu 2516 取石子游戏(斐波那契博弈)
题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=2516 Problem Description 1堆石子有n个,两人轮流取.先取者第1次可以取任意多个, ...
- 为什么使用HttpServlet?http协议特点、servlet
因为只有HttpServlet是基于http协议,实现Servlet接口,而http协议是短连接协议,能够实现客户端访问服务端后,数据交互后 连接自动断开.同时http协议基于tcp.ip协议,封装了 ...
- Servlet到Servlet的请求转发与重定向的区别
Servlet跳转到另一个Servlet中: request.getRequestDispatcher().forward();代表默认的是post方法,即在被跳转的Servlet的doPost()方 ...
- 浏览器被“hao123.3377.com”主页劫持的解决办法
问题描述: 浏览器被一个叫做hao123.3377的类似hao123网址导航的家伙,强行贴上.狗皮膏药一样. 问题解决: 尝试了网上说的包括下载360什么的,都不咋好用.后来发现是在激活win10(盗 ...
- [转]linux之初识SELinux
转自:http://www.linuxidc.com/Linux/2014-07/104447.htm 1.selinux的概述 selinux相信大家一定不会陌生,它的全称是内核级加强型防火墙.在服 ...
- Zookeeper的临时节点和永久节点
Zookeeper中节点分为两种:临时节点和永久节点. 临时节点有一个节点: 当创建临时节点的程序停掉之后,这个临时节点就会消失. 更直观的,如下 Persistent是临时节点. Persist ...
- Android互动设计-蓝牙遥控自走车iTank
一.让Android与外部的设备互动 iTank智能型移动平台基本款简介 iTank智能型移动平台是一台履带车,车体上方的控制板有一颗微处理器,我们可以通过它的UART或是I2C接口下达指令来控制iT ...