javascript getElementsByClassName 和js取地址栏参数
更新时间：2010年01月02日 02:45:38 作者：
为了从一大堆HTML代码中找出我们的树状菜单(也许有多个)，我们先来实现一个通过className找DOM节点的方法：getElementsByClassName。这是对浏览器自有DOM方法的一个简单但实用的扩充。
getElementsByClassName()
为了从一大堆HTML代码中找出我们的树状菜单(也许有多个)，我们先来实现一个通过className找DOM节点的方法：getElementsByClassName。这是对浏览器自有DOM方法的一个简单但实用的扩充。
此方法有两个参数：ele指出以哪个DOM节点为根节点寻找（也就是说只找ele的子节点），className指出符合条件的节点的class属性中必须包含怎样的className。它的返回值是一个数组，存放了所有符合条件的节点。
function getElementsByClassName(ele,className) {
//获取所有子节点
if(document.all){
var children = ele.all;
}else{
var children = ele.getElementsByTagName('*');
}
//遍历子节点并检查className属性
var elements = new Array();
for (var i = 0; i < children.length; i++) {
var child = children[i];
var classNames = child.className.split(' ');
for (var j = 0; j < classNames.length; j++) {
if (classNames[j] == className) {
elements[elements.length] = child;
break;
}
}
}
return elements;
}
var trees = getElementsByClassName(document,'TreeView');
最前面的一个if-else语是为了兼容IE5（IE5不能运行
document.getElementsByTagName('*')）。需要注意的是千万不要用浏览器检测的方法来写脚本，而应该直接使用将要用到的语句来测试是否可以执行，如果返回值为null或undefined，那再换一种方法。这样的脚本可以有更好的兼容性，也更健壮。
elements[elements.length] = child;，这句同样是为了兼容IE5才没有使用数组
的push方法。如果你一定要使用push方法，那么可以在执行getElementsByClassName()
之前先重载一遍push方法。代码如下：
Array.prototype.push = function(value){
this[this.length] = value;
} 注：原本我希望getElementsByClassName也能像push方法一样写，比如
HTMLElement.prototype.getElementsByClassName = ...。不过实际操作的时候发现在
运行时HTMLElement这个对象并不是固定的，每种tag似乎都不一样，只能作罢。
取地址栏参数
//v1:
var URLParams = new Array();
var aParams = document.location.search.substr(1).split('&');
for (i=0; i < aParams.length i++){
var aParam = aParams.split('=');
URLParams[aParam[0]] = aParam[1];
}
//取得传过来的name参数
name=URLParams['name'];
//v2:
Request = {
QueryString : function(item){
var svalue = location.search.match(new
RegExp('[\?\&]' + item + '=([^\&]*)(\&?)','i'));
return svalue ? svalue[1] : svalue;
}
}
var key = Request.QueryString('key');
为了从一大堆HTML代码中找出我们的树状菜单(也许有多个)，我们先来实现一个通过className找DOM节点的方法：getElementsByClassName。这是对浏览器自有DOM方法的一个简单但实用的扩充。
此方法有两个参数：ele指出以哪个DOM节点为根节点寻找（也就是说只找ele的子节点），className指出符合条件的节点的class属性中必须包含怎样的className。它的返回值是一个数组，存放了所有符合条件的节点。
复制代码 代码如下:
function getElementsByClassName(ele,className) {
//获取所有子节点
if(document.all){
var children = ele.all;
}else{
var children = ele.getElementsByTagName('*');
}
//遍历子节点并检查className属性
var elements = new Array();
for (var i = 0; i < children.length; i++) {
var child = children[i];
var classNames = child.className.split(' ');
for (var j = 0; j < classNames.length; j++) {
if (classNames[j] == className) {
elements[elements.length] = child;
break;
}
}
}
return elements;
}
var trees = getElementsByClassName(document,'TreeView');
最前面的一个if-else语是为了兼容IE5（IE5不能运行
document.getElementsByTagName('*')）。需要注意的是千万不要用浏览器检测的方法来写脚本，而应该直接使用将要用到的语句来测试是否可以执行，如果返回值为null或undefined，那再换一种方法。这样的脚本可以有更好的兼容性，也更健壮。
elements[elements.length] = child;，这句同样是为了兼容IE5才没有使用数组
的push方法。如果你一定要使用push方法，那么可以在执行getElementsByClassName()
之前先重载一遍push方法。代码如下：
Array.prototype.push = function(value){
this[this.length] = value;
} 注：原本我希望getElementsByClassName也能像push方法一样写，比如
HTMLElement.prototype.getElementsByClassName = ...。不过实际操作的时候发现在
运行时HTMLElement这个对象并不是固定的，每种tag似乎都不一样，只能作罢。
取地址栏参数
复制代码 代码如下:
//v1:
var URLParams = new Array();
var aParams = document.location.search.substr(1).split('&');
for (i=0; i < aParams.length i++){
var aParam = aParams.split('=');
URLParams[aParam[0]] = aParam[1];
}
//取得传过来的name参数
name=URLParams['name'];
//v2:
Request = {
QueryString : function(item){
var svalue = location.search.match(new
RegExp('[\?\&]' + item + '=([^\&]*)(\&?)','i'));
return svalue ? svalue[1] : svalue;
}
}
var key = Request.QueryString('key');
您可能感兴趣的文章:
- javascript getElementsByClassName函数
- js document.getElementsByClassName的使用介绍与自定义函数
- js 获取class的元素的方法 以及创建方法getElementsByClassName
- javascript getElementsByClassName实现代码
- 使用classList来实现两个按钮样式的切换方法
- Javascript 多浏览器兼容性问题及解决方案
- IE8的JavaScript点击事件(onclick)不兼容的解决方法
- JavaScript在IE和Firefox(火狐)的不兼容问题解决方法小结
- JavaScript中解决多浏览器兼容性23个问题的快速解决方法
- JS中getElementsByClassName与classList兼容性问题解决方案分析
相关文章
本篇文章主要是对JS获取地址栏参数的几种方法进行了介绍，需要的朋友可以过来参考下，希望对大家有所帮助2014-02-02
以下是平时收集的几个常用代码段，大多数是从网上搜集而来。也均为未找到是谁谁原创，是否允许转载等要求， 所以如果看到的朋友发现其中有些代码是自己写的，还请原谅在下转帖出来2011-11-11
这篇文章主要介绍了JavaScript中的ubound函数使用实例,本文先是讲解了ubound函数的语法,然后给出了用法代码实例,需要的朋友可以参考下2014-11-11
V8是Google开发的JavaScript引擎,采用分代垃圾回收机制自动管理内存,包括新生代和老生代,新生代使用Scavenge算法快速回收短生命周期对象,老生代使用标记-清除和标记-整理算法优化长期存活对象的回收,V8通过增量标记、并发GC和增量压缩等优化策略减少垃圾回收对性能的影响2025-02-02
这篇文章主要介绍了JS实现鼠标拖拽盒子移动及右键点击盒子消失效果,涉及javascript事件响应及页面元素属性动态操作相关实现技巧,需要的朋友可以参考下2019-01-01
JavaScript实现简单图片滚动，9张图告诉你，C罗欲哭无泪，另附源码下载，方便学习2014-06-06
我们在使用JS渲染DOM时，一般使用字符串创建DOM然后附加到父元素上，如果附加的DOM是动态易变的，那需要在函数中写大量逻辑。如果在控件实现过程中，这带来的问题更为严重。2013-04-04
这篇文章主要为大家详细介绍了JavaScript分页组件使用方法，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2021-07-07
Date() 日期对象是一个构造函数必须使用new来调用创建我们的日期对象,本文给大家介绍JS中的Date()使用小结,感兴趣的朋友一起看看吧2024-01-01
《javascript设计模式》学习笔记四：Javascript面向对象程序设计链式调用实例分析
这篇文章主要介绍了Javascript面向对象程序设计链式调用,结合实例形式分析了《javascript设计模式》中链式调用的原理与简单使用技巧,需要的朋友可以参考下2020-04-04
最新评论