prototype中的$$函数的用法

简介:

这个$$相当有用,从例子中可以发现省去好多的代码

 
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 
  2. <html> 
  3.     <head> 
  4.         <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
  5.         <title>Untitled Document</title> 
  6.         <script src="prototype.js"></script> 
  7.         <script> 
  8.             //$$相当于Javascript中的getElementByTagName 
  9.             function _$$Test(){ 
  10.                 var _$$ = $$('input'); 
  11.                 for(i=0;i<_$$.length;i++){ 
  12.                     alert(_$$[i].value); 
  13.                 } 
  14.                  
  15.                 //$$()中的三部分内容可以分开也可以写到一起 
  16.                 var f = $$('div #testForm.field input'); 
  17.                 var s = ''
  18.                 for(var i=0; i<f.length; i++){ 
  19.                     s += f[i].value + '/'; 
  20.                 } 
  21.                 alert(s); 
  22.                  
  23.                 f = $$('div#testForm.field input', 'div#testForm.fieldName'); 
  24.                 s = ''
  25.                 for(var i=0; i<f.length; i++){ 
  26.                     s += ( f[i].value ? f[i].value : f[i].innerHTML ) + '/'; 
  27.                 } 
  28.                 alert(s); 
  29.             } 
  30.         </script> 
  31.     </head> 
  32.     <body> 
  33.         <div id="testForm"> 
  34.             <div class='field'> 
  35.                 <span class='fieldName'>User name:</span> 
  36.                 <input type='text' id='txtName' value='sucre'/> 
  37.             </div> 
  38.             <div class='field'> 
  39.                 <span class='fieldName'>Password:</span> 
  40.                 <input type='password' id='txtPass' value='secret' /> 
  41.             </div> 
  42.             <input type='submit' value='login' /> 
  43.         </div> 
  44.         <input type="text" value="输入框"/> 
  45.         <input type="hidden" value="隐藏域"/> 
  46.         <input type="radio" value="单选框"/> 
  47.         <input type="checkbox" value="复选框"/> 
  48.         <input type="button" value="GO" onclick="_$$Test()"/> 
  49.     </body> 
  50. </html> 

将Javascript重新封装,不错,好用



本文转自sucre03 51CTO博客,原文链接:http://blog.51cto.com/sucre/410373,如需转载请自行联系原作者


相关文章
|
8月前
|
前端开发 网络架构
ES6-ES11-第一部分-let、const、解构赋值、模板字符串、简化对象写法、箭头函数、函数参数默认值、rest 参数、扩展运算符、Symbol、迭代器、生成器、Promise、Set、Map(二)
ES6-ES11-第一部分-let、const、解构赋值、模板字符串、简化对象写法、箭头函数、函数参数默认值、rest 参数、扩展运算符、Symbol、迭代器、生成器、Promise、Set、Map(二)
|
8月前
|
前端开发 网络架构
ES6-ES11-第一部分-let、const、解构赋值、模板字符串、简化对象写法、箭头函数、函数参数默认值、rest 参数、扩展运算符、Symbol、迭代器、生成器、Promise、Set、Map(四)
ES6-ES11-第一部分-let、const、解构赋值、模板字符串、简化对象写法、箭头函数、函数参数默认值、rest 参数、扩展运算符、Symbol、迭代器、生成器、Promise、Set、Map(四)
|
11月前
|
JavaScript 前端开发
|
12月前
|
JavaScript 前端开发
Function() 构造函数
Function() 构造函数
46 0
Array.prototype.includes() 原型调用用法案例讲解
Array.prototype.includes() 原型调用用法案例讲解
87 2
|
前端开发
less语法(一)变量与extend
less语法(一)变量与extend
|
JavaScript 前端开发
函数原型中的 call 和 apply 方法的区别
它们是在 JavaScript 引擎内在实现的,因为属于Function.prototype,所以每个Function对象实例,也就是每个方法都有call, apply属性。它们的作用一样,只是使用方式不同。
109 0
【Groovy】闭包 Closure ( 闭包调用 与 call 方法关联 | 接口中定义 call() 方法 | 类中定义 call() 方法 | 代码示例 )
【Groovy】闭包 Closure ( 闭包调用 与 call 方法关联 | 接口中定义 call() 方法 | 类中定义 call() 方法 | 代码示例 )
183 0
【Groovy】闭包 Closure ( 闭包调用 与 call 方法关联 | 接口中定义 call() 方法 | 类中定义 call() 方法 | 代码示例 )
一段代码看懂原型对象中的callback
一段代码看懂原型对象中的callback
109 0
一段代码看懂原型对象中的callback
|
Web App开发 JavaScript 前端开发