prototype.js扩展document.getElementsByName()

    最近做模具标套管理时,需要手动配置列的属性数目,导致在jsp页面上需要通过标签的name属性来获得一个数组标签对象,从而做些业务上的判断,公司经常用的prototype.js,随想在js上添加一个document.getElementsByName()的简写方式,类似$()。

 

//此代码放入prototype.js中
function $S() {	
  var results = [], element;  
  for (var i = 0; i < arguments.length; i++) { // 可以传入多个参数
    element = arguments[i];   
    if (typeof element == 'string')	// 如果参数的类型是字符串		
      element = document.getElementsByName(element); 
      results.push(Element.extend(element)); // 将得到的对象加入results数组
  }
  // 如果只返回一个对象,直接返回该对象,如果返回了多个对象,则返回包含所有这些对象的数组
  return results.length < 2 ? results[0] : results;
}

 测试如下:

 

<html>
<script src="D:/test/prototype.js" type="text/javascript"></script>
<SCRIPT language="JavaScript">

function oncl(){
	var e = $S('abc','abec');
	for(i=0;i<e.length;i++){
		for(j=0;j<e[i].length;j++)
			alert(e[i][j].value);
	}	//多个参数

	var d = $S('abc');
	for(i=0;i<d.length;i++){		
		alert(d[i].value);
	}	//单个参数
}
</SCRIPT>
<body>
<form method="post" name="info">
<input type="text" name="abc" id="abc1" value="11" />
<input type="text" name="abc" id="abc2" value="12" />
<input type="text" name="abc" id="abc2" value="13" />
<input type="text" name="abc" id="abc2" value="14" />
<input type="text" name="abc" id="abc2" value="15" />

<input type="text" name="abec" id="abc2" value="105" />
<input type="text" name="abec" id="abc2" value="150" />
<input type="text" name="abec" id="abc2" value="1150" />
<input type="text" name="abec" id="abc2" value="125" />
<input type="text" name="abec" id="abc2" value="115" />
<input type="text" name="abec" id="abc2" value="1855" />
<input type="button" value="sub" onClick="oncl()" />
</form>
</body>
</html>

你可能感兴趣的:(JavaScript,html,jsp,prototype,J#)