javascript getElementsByClassName 和js取地址栏参数


Posted in Javascript onJanuary 02, 2010

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');
Javascript 相关文章推荐
js 在定义的时候立即执行的函数表达式(function)写法
Jan 16 Javascript
js下拉框二级关联菜单效果代码具体实现
Aug 03 Javascript
15条JavaScript最佳实践小结
Aug 09 Javascript
Javascript学习笔记之 对象篇(三) : hasOwnProperty
Jun 24 Javascript
js键盘事件的keyCode
Jul 29 Javascript
JS制作简单的三级联动
Mar 18 Javascript
深入理解MVC中的时间js格式化
May 19 Javascript
jquery ajaxfileupload异步上传插件使用详解
Feb 08 Javascript
Jquery中attr与prop的区别详解
May 27 jQuery
原生javascript实现类似vue的数据绑定功能示例【观察者模式】
Feb 24 Javascript
Angular5整合富文本编辑器TinyMCE的方法(汉化+上传)
May 26 Javascript
Vuejs通过拖动改变元素宽度实现自适应
Sep 02 Javascript
firefox插件Firebug的使用教程
Jan 02 #Javascript
firefox firebug中文入门教程 脚本之家新年特别版
Jan 02 #Javascript
Firefox+FireBug使JQuery的学习更加轻松愉快
Jan 01 #Javascript
20个非常棒的Jquery实用工具 国外文章
Jan 01 #Javascript
JavaScript与DropDownList 区别分析
Jan 01 #Javascript
HTML node相关的一些资料整理
Jan 01 #Javascript
JQery 渐变图片导航效果代码 漂亮
Jan 01 #Javascript
You might like
WINDOWS服务器安装多套PHP的另类解决方案
2006/10/09 PHP
PHP伪静态页面函数附使用方法
2008/06/20 PHP
php获取URL中带#号等特殊符号参数的解决方法
2014/09/02 PHP
PHP实现导出excel数据的类库用法示例
2016/10/15 PHP
PHP中使用OpenSSL生成证书及加密解密
2017/02/05 PHP
PHP通过文件路径获取文件名的实例代码
2018/10/14 PHP
用Javascript读取中文COOKIE的解决办法
2007/02/15 Javascript
JS的递增/递减运算符和带操作的赋值运算符的等价式
2007/12/08 Javascript
Dreamweaver jQuery智能提示插件,支持版本提示,支持1.6api
2011/07/31 Javascript
jQuery EasyUI API 中文文档 - Parser 解析器
2011/09/29 Javascript
Firefox/Chrome/Safari的中可直接使用$/$$函数进行调试
2012/02/13 Javascript
js日期、星座的级联显示代码
2014/01/23 Javascript
jQuery UI设置固定日期选择特效代码分享
2015/08/27 Javascript
JS实现横向拉伸动感伸缩菜单效果代码
2015/09/04 Javascript
理解javascript封装
2016/02/23 Javascript
vue动态路由实现多级嵌套面包屑的思路与方法
2017/08/16 Javascript
angularjs路由传值$routeParams详解
2020/09/05 Javascript
通过vue-cli来学习修改Webpack多环境配置和发布问题
2017/12/22 Javascript
laypage.js分页插件使用方法详解
2019/07/27 Javascript
vue+elementUi图片上传组件使用详解
2019/08/20 Javascript
[50:20]DOTA2上海特级锦标赛主赛事日 - 5 总决赛Liquid VS Secret第四局
2016/03/06 DOTA
[36:05]完美世界DOTA2联赛循环赛 Forest vs DM 第一场 11.06
2020/11/06 DOTA
python中join()方法介绍
2018/10/11 Python
Python中使用pypdf2合并、分割、加密pdf文件的代码详解
2019/05/21 Python
使用python搭建服务器并实现Android端与之通信的方法
2019/06/28 Python
python 并发编程 阻塞IO模型原理解析
2019/08/20 Python
python实现图像拼接
2020/03/05 Python
Django Model中字段(field)的各种选项说明
2020/05/19 Python
在pytorch中动态调整优化器的学习率方式
2020/06/24 Python
python如何调用php文件中的函数详解
2020/12/29 Python
Sunglasses Shop荷兰站:英国最大的太阳镜独立在线零售商和供应商
2017/01/08 全球购物
德国电子产品购物网站:TechInTheBasket德国
2018/12/07 全球购物
微型企业创业投资计划书
2014/01/10 职场文书
2014乡镇干部纪律作风整顿思想汇报
2014/09/13 职场文书
Django debug为True时,css加载失败的解决方案
2021/04/24 Python
Python实现简单的猜单词
2021/06/15 Python