获取DOM对象的几种扩展及简写


Posted in Javascript onOctober 09, 2006

参照prototype.js中getElementsByClassName的思想,扩展出几种在DEOM操作中可经常用到的获取对象的方法,使用获取对象变得更方便、更精确了:
document.getElementsByClassName = function(className,oBox) {
//适用于获取某个HTML区块内部含有某一特定className的所有HTML元素
this.d= oBox || document;
var children = this.d.getElementsByTagName('*') || document.all;
var elements = new Array();
for (var ii = 0; ii < children.length; ii++) {
var child = children[ii];
var classNames = child.className.split(' ');
for (var j = 0; j < classNames.length; j++) {
if (classNames[j] == className) {
elements.push(child);
break;
}
}
}
return elements;
}

document.getElementsByType = function(sTypeValue,oBox) {
//适用于获取某个HTML区块内部同属于某一特定type的所有HTML元素,如:input,script,link等等
this.d= oBox || document;
var children = this.d.getElementsByTagName('*') || document.all;
var elements = new Array();
for (var ii = 0; ii < children.length; ii++) {
if (children[ii].type == sTypeValue) {
elements.push(children[ii]);
}
}
return elements;
}

function $() {
var elements = new Array();
for (var ii = 0; ii < arguments.length; ii++) {
var element = arguments[ii];
if (typeof element == 'string')
element = document.getElementById(element);
if (arguments.length == 1)
return element;
elements.push(element);
}
return elements;
}

$Cls = function (s,o){
return document.getElementsByClassName(s,o);
};

$Type = function (s,o){
return document.getElementsByType(s,o);
};

$Tag = function (s,o){
this.d=o || document;
return this.d.getElementsByTagName(s);
};

$Name = function (s){ //通过name的方式只能针对整个document而言,不能为其限定范围
return document.getElementsByName(s);
}; 

Javascript 相关文章推荐
关于IE7 IE8弹出窗口顶上
Dec 22 Javascript
JavaScript CSS修改学习第五章 给“上传”添加样式
Feb 19 Javascript
js 实现图片预加载(js操作 Image对象属性complete ,事件onload 异步加载图片)
Mar 25 Javascript
js变量以及其作用域详解
Jul 18 Javascript
Javascript基础教程之while语句
Jan 18 Javascript
可以浮动某个物体的jquery控件用法实例
Jul 24 Javascript
使用impress.js制作幻灯片
Sep 09 Javascript
详谈js中数组(array)和对象(object)的区别
Feb 27 Javascript
使用gulp搭建本地服务器并实现模拟ajax
Apr 05 Javascript
使用vue-cli(vue脚手架)快速搭建项目的方法
May 21 Javascript
Websocket 向指定用户发消息的方法
Jan 09 Javascript
探索node之事件循环的实现
Oct 30 Javascript
js几个不错的函数 $$()
Oct 09 #Javascript
使用Javascript和DOM Interfaces来处理HTML
Oct 09 #Javascript
激活 ActiveX 控件
Oct 09 #Javascript
自动更新作用
Oct 08 #Javascript
许愿墙中用到的函数
Oct 07 #Javascript
解放web程序员的输入验证
Oct 06 #Javascript
通过ifame指向的页面高度调整iframe的高度
Oct 05 #Javascript
You might like
Php Cookie的一个使用注意点
2008/11/08 PHP
php5.3后静态绑定用法详解
2016/11/11 PHP
PHP将字符串首字母大小写转换的实例
2017/01/21 PHP
利用PHP判断是否是连乘数字串的方法示例
2017/07/03 PHP
PHP实现网站访问量计数器
2017/10/27 PHP
将nodejs打包工具整合到鼠标右键的方法
2013/05/11 NodeJs
JS日期加减,日期运算代码
2015/11/05 Javascript
基于JavaScript实现Json数据根据某个字段进行排序
2015/11/24 Javascript
理解javascript函数式编程中的闭包(closure)
2016/03/08 Javascript
基于jQuery实现的查看全文功能【实用】
2016/12/11 Javascript
JS全角与半角转化实例(分享)
2017/07/04 Javascript
vue学习笔记之v-if和v-show的区别
2017/09/20 Javascript
webpack中的热刷新与热加载的区别
2018/04/09 Javascript
在HTML文档中嵌入JavaScript的四种方法
2018/05/07 Javascript
VUE+Element UI实现简单的表格行内编辑效果的示例的代码
2018/10/31 Javascript
高性能js数组去重(12种方法,史上最全)
2019/12/21 Javascript
小程序如何定位所在城市及发起周边搜索
2020/02/11 Javascript
[08:04]TI4西雅图DOTA2前线报道 海涛探访各路人马
2014/07/09 DOTA
[00:32]2016完美“圣”典风云人物:Maybe宣传片
2016/12/05 DOTA
python 简易计算器程序,代码就几行
2009/08/29 Python
深入学习Python中的上下文管理器与else块
2017/08/27 Python
PyQt5打开文件对话框QFileDialog实例代码
2018/02/07 Python
PyTorch 导数应用的使用教程
2020/08/31 Python
python 爬虫爬取京东ps4售卖情况
2020/12/18 Python
css3弹性盒模型(Flexbox)详细介绍
2014/10/08 HTML / CSS
英国骑行、跑步、游泳、铁人三项运动装备专卖店:Wiggle
2016/08/23 全球购物
《尊严》教学反思
2014/02/11 职场文书
电子信息工程专业推荐信
2014/02/14 职场文书
2014年测量员工作总结
2014/12/12 职场文书
优秀教师先进事迹材料
2014/12/15 职场文书
中学教师师德师风承诺书
2015/04/28 职场文书
运动会闭幕式通讯稿
2015/07/18 职场文书
Python中的np.argmin()和np.argmax()函数用法
2021/06/02 Python
SpringBoot SpringEL表达式的使用
2021/07/25 Java/Android
CSS3实现360度循环旋转功能
2022/02/12 HTML / CSS
【海涛dota解说】海涛小满开黑4v5被破两路翻盘潮汐第一视角解说
2022/04/01 DOTA