JavaScript DOM对象获取的几种扩展与简写方法

DOM对象获取的扩展与简写方法

参考prototype.js中getElementsByClassName的实现思路，本文扩展出几种在DOM操作中常用的对象获取方法，使获取对象的操作更加便捷和精确。

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);}