获取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 constructor的实际作用分析
Nov 15 Javascript
javascript同页面多次调用弹出层具体实例代码
Aug 16 Javascript
javascript正则表达式基础知识入门
Apr 20 Javascript
freemarker判断对象是否为空的方法
Aug 13 Javascript
高性能JavaScript循环语句和条件语句
Jan 20 Javascript
jQuery插件EasyUI设置datagrid的checkbox为禁用状态的方法
Aug 05 Javascript
js Canvas实现圆形时钟教程
Sep 19 Javascript
详解微信小程序开发之城市选择器 城市切换
Jan 17 Javascript
thinkjs之页面跳转同步异步操作
Feb 05 Javascript
jQuery实现的手风琴侧边菜单效果
Mar 29 jQuery
使用js获取伪元素的content实例
Oct 24 Javascript
详解Vue 全局引入bass.scss 处理方案
Mar 26 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
smarty内置函数{loteral}、{ldelim}和{rdelim}用法实例
2015/01/22 PHP
PHP 微信支付类 demo
2015/11/30 PHP
一个简单的php MVC留言本实例代码(必看篇)
2016/09/22 PHP
PHP中Cookie的使用详解(简单易懂)
2017/04/28 PHP
PHP+AJAX 投票器功能
2017/11/11 PHP
Laravel使用RabbitMQ的方法示例
2019/06/18 PHP
javascript 子窗体父窗体相互传值方法
2010/05/31 Javascript
给事件响应函数传参数的四种方式小结
2013/12/05 Javascript
javascript简单实现命名空间效果
2014/03/06 Javascript
javascript常见用法总结
2014/05/22 Javascript
JS+CSS实现简易的滑动门效果代码
2015/09/24 Javascript
JavaScript修改作用域外变量的方法
2016/03/25 Javascript
JavaScript编写页面半透明遮罩效果的简单示例
2016/05/09 Javascript
基于BootStrap Metronic开发框架经验小结【七】数据的导入、导出及附件的查看处理
2016/05/12 Javascript
js实现漫天星星效果
2017/01/19 Javascript
利用原生JS与jQuery实现数字线性变化的动画
2017/02/24 Javascript
jquery网页加载进度条的实现
2017/06/01 jQuery
JavaScript的setter与getter方法
2017/11/29 Javascript
详解Vue2.0配置mint-ui踩过的那些坑
2018/04/23 Javascript
node.js +mongdb实现登录功能
2020/06/18 Javascript
详解Django框架中的视图级缓存
2015/07/23 Python
基于Python的接口测试框架实例
2016/11/04 Python
Python tkinter模块弹出窗口及传值回到主窗口操作详解
2017/07/28 Python
Python实现调度算法代码详解
2017/12/01 Python
浅述python2与python3的简单区别
2018/09/19 Python
Python类的继承、多态及获取对象信息操作详解
2019/02/28 Python
Django Rest framework解析器和渲染器详解
2019/07/25 Python
python Scrapy爬虫框架的使用
2021/01/21 Python
出国导师推荐信
2014/01/16 职场文书
第一批党的群众路线教育实践活动工作总结
2014/03/03 职场文书
机电一体化毕业生自荐信
2014/06/19 职场文书
市场策划求职信
2014/08/07 职场文书
女方离婚起诉书
2015/05/18 职场文书
叶问观后感
2015/06/15 职场文书
Jedis操作Redis实现模拟验证码发送功能
2021/09/25 Redis
python 管理系统实现mysql交互的示例代码
2021/12/06 Python