JavaScript, DOM查找元素
1.document.getElementById("id");
=> IE8 及较低版本不区分ID的大小写
=> IE7及较低版本中表单元素的name特性和ID都会被该方法返回
2.document.getElementsByTagName("Tag");
=> 为了最大限度的兼容既有的HTML页面,该方法不区分大小写
=> 但在XML和XHTML中区分大小写
3.document.getElementsByName("name");
=> 用于获取带有name属性的表单元素(多用于获取单选按钮(radio)选中的值)
4.document.getElementsByClassName("class");
=> IE8及更低版本不支持该方法
function getByClass(oParent, sClass){
var aEle = oParent.getElementsByTagName('*');
var result = [];
//var re = '/\\b'+sClass+'\\b/i';
///\bbox\b/i /\bbox\b/i
var re = new RegExp('\\b'+sClass+'\\b','i');
for( i=0;i<aEle.length;i++){
//if(aEle[i].className == sClass)
//if(aEle[i].className.search(re))
if(re.test(aEle[i].className))
{
result.push(aEle[i]);
}
}
return result;
}
5.document.querySelector("#id/.class/tag")和document.querySelectorAll()
=> IE7及较低版本不支持
=> 获取的元素为静态nodeList
6.classList属性(obj.classList.add()/obj.classList.remove()/obj.classList.toggle())
=> IE9及较低版本不支持该属性
function removeClass(obj, name) {
var classNames = obj.className.split(/\s/);
var len = classNames.length;
for(var i=0; i<len; i++){
if(name === classNames[i]){
classNames.splice(i, 1);
break;
}
}
obj.className = classNames.join(" ");
}
JavaScript, DOM查找元素的更多相关文章
- JavaScript Dom 查找
JavaScript Dom 查找 一.直接查找 获取单个元素 document.getElementById('i1') 获取多个元素(列表数组) document.getElementsByTag ...
- DOM查找元素
1. 查找元素5种: 1. 按id查找1个元素对象: var elem=document.getElementById("id值"); 何时使用:1. 元素必须有id 2. 精确查 ...
- DOM查找元素的方法总结
按HTML查找:优点:范围可大可小,可设置条件:包括五种方式:1.按id查找:2.按标签名查找:var elems = parent.getElementsByTagName('');3.按name属 ...
- Python 15 html 基础 - CSS &javascript &DOM
本节内容 CSS基础 javascript基础 DOM 前言,这边这块楼主已经很熟悉了,CSS天天用到,简单的一些javascript也是所以就挑点重点说了.然后就是dom不怎么用,但是其实也用不到, ...
- JavaScript Dom基础-9-Dom查找方法; 设置DOM元素的样式; innerHTML属性的应用; className属性的应用; DOM元素上添加删除获取属性;
JavaScript Dom基础 学习目标 1.掌握基本的Dom查找方法 domcument.getElementById() Domcument.getElementBy TagName() 2.掌 ...
- JavaScript获取HTML DOM节点元素详解(转)
在Web运用程序特别是Web 2.0程序开发中,经常要获取页面中某个元素,然后更新该元素的样式.内容等.如何获取要更新的元素,是首先要处理的疑问. 51CTO推荐阅读:JavaScript DOM文档 ...
- JavaScript DOM动态创建(声明)Object元素
http://www.cnblogs.com/GuominQiu/archive/2011/04/01/2002783.html 一文提及“等整个页面加载完毕后,根据用户所选的阅读机类型,再用Java ...
- JavaScript DOM实战:创建和克隆元素
DOM来创建和克隆元素. createElement()和createTextNode() createElement()和createTextNode()做的事情正如它们的名字所说的那样.最常见的J ...
- JavaScript DOM编程基础精华01(DOM入门,DOM模型和获取页面元素,事件,window对象的方法)
DOM入门 DOM就是Html页面的模型,将每个标签都做为一个对象,JavaScript通过调用DOM中的属性.方法就可以对网页中的文本框.层等元素进行编程控制.比如通过操作文本框的DOM对象,就可以 ...
随机推荐
- Provided id of the wrong type for class pojo.Books. Expected: class java.lang.Integer, got class java.lang.Long
log4j:WARN No appenders could be found for logger (org.hibernate.cfg.Environment). log4j:WARN Please ...
- [JS] Topic - why "strict mode" here
Ref: Javascript 严格模式详解 使得Javascript在更严格的条件下运行: - 消除Javascript语法的一些不合理.不严谨之处,减少一些怪异行为; - 消除代码运行的一些不安全 ...
- [Laravel] 14 - REST API: Laravel from scratch
前言 一.基础 Ref: Build a REST API with Laravel API resources Goto: [Node.js] 08 - Web Server and REST AP ...
- 大杂烩 -- HashMap、HashTable、ConCurrentHashMap 联系与区别
基础大杂烩 -- 目录 -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- 1. Hashtable 和 HashMap ⑴ ...
- Fiddler 简介
Fiddler 简介: (1) Fiddler 是一个抓包工具,主要用来对 HTTP 请求进行分析,浏览器按 F12 也可以进行抓包,但是比较轻量,不支持一些复杂的抓包:(2) WireShark 工 ...
- android高级---->Handler的原理
andriod提供了Handler来满足线程间的通信,上次在更新UI的时候也提到过Handler的使用,关于Handler的基本使用,参见博客(android基础---->子线程更新UI).今天 ...
- 解决Android SDK Manager无法更新下载
Android Studio2.2版本有一个bug,当在gradle文件编写代码时,程序会自动同步编译,这时整个程序都处于页面卡顿状态,要等待很久才能缓过来.最近实在忍受不了这种龟速,刚好发现有了新的 ...
- ubuntu上安装docker
author : headsen chen date : 2019-03-06 16:36:12 apt-get remove docker docker-engine docker-ce dock ...
- java转换图片压缩生成webp格式
http://blog.csdn.net/xu_san_duo/article/details/79085718
- web.config 加密/解密 正确版
一般加密方式: 利用Aspnet_regiis: cd C:\Windows\Microsoft.NET\Framework\v4.0.30319 aspnet_regiis -pe "co ...