[ 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 ...
随机推荐
- C#使用Parallel处理数据同步写入Datatable并使用BulkInsert批量导入数据库
项目需要,几十万张照片需要计算出每个照片的特征值(调用C++编写的DLL). 业务流程:选择照片文件夹,分别访问照片-->调用DLL接口传递照片路径-->接收处理返回值-->写入数据 ...
- Jsoup爬虫获取公司纳税识别号
天眼查 /** * 根据公司名称获取统一社会信用代码 * * @author xiaofei.xian 日期:2019年3月20日 上午11:12:41 */ public class GetTaxN ...
- JavaScript--认识DOM
文档对象模型DOM(Document Object Model)定义访问和处理HTML文档的标准方法.DOM 将HTML文档呈现为带有元素.属性和文本的树结构(节点树). 先来看看下面代码: 将HTM ...
- JavaScript--如何插入JS
我们来看看如何写入JS代码?你只需一步操作,使用<script>标签在HTML网页中插入JavaScript代码.注意, <script>标签要成对出现,并把JavaScrip ...
- Python多线程、多进程
1.from multiprocessing import Process ; from threading import Thread 2.进程之间的数据传输 ,一般会使用到pipes, qu ...
- Swift自适应布局(Adaptive Layout)教程
通用的Storyboard 通用的stroyboard文件是通向自适应布局光明大道的第一步.在一个storyboard文件中适配iPad和iPhone的布局在iOS8中已不再是梦想.我们不必再为不同尺 ...
- 关于GIT使用过程中遇到的问题
npm构建,将所需要安装的依赖添加至package.json文件中,使用cnpm i进行安装 #拉去指定项目的默认分支: git pull http://username:password@gitla ...
- 新认知之WinForm窗体程序
Windows应用程序和控制台应用程序有很大的区别 >Form1.cs :窗体文件,程序员对窗体编写的代码一般都存放在这个文件中. >Form1.Designer.cs :窗体设计文件, ...
- 在已有spring的基础上集成hibernate
1.导入hibernate的包和spring的包 hibernate3.hibernate-jpa-2.0-api-.必须的包,log4j,log4j配置文件 1.1 导入Spring的依赖包 ...
- JS——null
变量被赋值为null,目的往往是为了销毁这个对象: var n1 = 1; n1 = null;