获取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 相关文章推荐
中文字符串截取的js函数代码
Apr 17 Javascript
jquery 利用show和hidden实现级联菜单示例代码
Aug 09 Javascript
js substring从右边获取指定长度字符串(示例代码)
Dec 23 Javascript
js事件绑定快捷键以ctrl+k为例
Sep 30 Javascript
浅析创建javascript对象的方法
May 13 Javascript
JS数组去重(4种方法)
Mar 27 Javascript
node.js平台下利用cookie实现记住密码登陆(Express+Ejs+Mysql)
Apr 26 Javascript
jquery实现企业定位式导航效果
Jan 01 jQuery
javascript实现获取一个日期段内每天不同的价格(计算入住总价格)
Feb 05 Javascript
vue+axios+promise实际开发用法详解
Oct 15 Javascript
JS开发自己的类库实例分析
Aug 28 Javascript
vue项目两种方式实现竖向表格的思路分析
Apr 28 Vue.js
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如何得到当前页和上一页的地址?
2006/11/27 PHP
XAMPP安装与使用方法详细解析
2013/11/27 PHP
PHP中iconv函数转码时截断字符问题的解决方法
2015/01/21 PHP
smarty模板判断数组为空的方法
2015/06/10 PHP
Twig模板引擎用法入门教程
2016/01/20 PHP
php字符串比较函数用法小结(strcmp,strcasecmp,strnatcmp及strnatcasecmp)
2016/07/18 PHP
PHP7匿名类的用法示例
2019/04/05 PHP
Extjs中通过Tree加载右侧TabPanel具体实现
2013/05/05 Javascript
jquery实现勾选复选框触发事件给input赋值
2015/02/01 Javascript
原生js结合html5制作简易的双色子游戏
2015/03/30 Javascript
JavaScript中pop()方法的使用教程
2015/06/09 Javascript
jQuery实现form表单元素序列化为json对象的方法
2015/12/09 Javascript
jQuery动画显示和隐藏效果实例演示(附demo源码下载)
2015/12/31 Javascript
jQuery Ajax页面局部加载方法汇总
2016/06/02 Javascript
深入理解JavaScript中Ajax
2016/08/02 Javascript
jQuery animate()实现背景色渐变效果的处理方法【使用jQuery.color.js插件】
2017/03/15 Javascript
JS+HTML+CSS实现轮播效果
2017/11/28 Javascript
Vue-cli@3.0 插件系统简析
2018/09/05 Javascript
解决ng-repeat产生的ng-model中取不到值的问题
2018/10/02 Javascript
vue实现的请求服务器端API接口示例
2019/05/25 Javascript
vue实现前台列表数据过滤搜索、分页效果
2019/05/28 Javascript
手机浏览器唤起微信分享(JS)
2020/10/11 Javascript
[00:52]DOTA2齐天大圣预告片
2016/08/13 DOTA
[01:08:32]DOTA2-DPC中国联赛 正赛 DLG vs PHOENIX BO3 第二场 1月18日
2021/03/11 DOTA
进一步探究Python的装饰器的运用
2015/05/05 Python
详谈套接字中SO_REUSEPORT和SO_REUSEADDR的区别
2018/04/28 Python
Python unittest单元测试框架总结
2018/09/08 Python
Pyorch之numpy与torch之间相互转换方式
2019/12/31 Python
django使用F方法更新一个对象多个对象字段的实现
2020/03/28 Python
SkinCeuticals官网:美国药妆品牌
2018/04/19 全球购物
斯洛伐克香水和化妆品购物网站:Parfemy-Elnino.sk
2020/01/28 全球购物
程序员经常用到的UNIX命令
2015/04/13 面试题
《学会待客》教学反思
2014/02/22 职场文书
保卫科工作岗位职责
2014/03/01 职场文书
2015社区六五普法工作总结
2015/04/21 职场文书
2019通用版导游词范本!
2019/08/07 职场文书