涓囦竴浣犳病鏈変嬌鐢ㄨ繃澶у悕榧庨紟鐨刾rototype.js錛岄偅涔堣鎴戞潵鍛婅瘔浣狅紝prototype.js鏄敱Sam Stephenson鍐欑殑涓涓猨avascript綾誨簱銆傝繖涓瀯鎬濆濡欙紝鑰屼笖鍏煎鏍囧噯鐨勭被搴擄紝鑳藉府鍔╀綘杞繪澗寤虹珛鏈夐珮搴︿簰鍔ㄧ殑web2.0鐗規(guī)х殑瀵屽鎴風(fēng)欏甸潰銆?br />濡傛灉浣犳渶榪戝皾璇曚嬌鐢ㄥ畠錛屼綘澶ф浜?jiǎn)瑙ｅ埌鏂囨。迤堜笉鏄綔鑰呯殑涓涓己欏廣傚拰鍦ㄦ垜浠ュ墠浣跨敤榪欎釜綾誨簱鐨勪笉灝戝紑鍙戣呬竴鏍鳳紝涓寮濮嬶紝鎴戜笉寰椾笉涓澶存墡榪涢槄璇籶rototype.js鐨勬簮浠ｇ爜鍜屽疄楠屽畠鐨勫姛鑳戒腑銆傛垜鎯籌紝鍦ㄦ垜瀛︿範(fàn)瀹屽畠涔嬪悗錛屾妸鎴戝鍒扮殑涓滆タ鍒嗕韓緇欏ぇ瀹舵槸浠朵笉閿欑殑浜嬨?br />鍚屾椂錛屽湪鏈枃涓紝鎴戜篃灝嗘彁渚涗竴涓叧浜庤繖涓被搴撴彁渚涚殑objects,classes,functions,extensions榪欏涓滀笢鐨勯潪瀹樻柟鍙傝?br />鍦ㄩ槄璇昏繖涓枃妗ｆ椂錛岀啛鎮(zhèn)塕uby鐨勫紑鍙戣呭皢浼?xì)娉ㄦ剰鍒癛uby鐨勪竴浜涘唴寤虹被鍜屾湰綾誨簱鎵╁睍瀹炵幇涔嬮棿闈炲父鐩鎬技銆?br />鐩稿叧鏂囩珷
Advanced JavaScript guide.
涓浜涘疄鐢ㄧ殑鍑芥暟
榪欎釜綾誨簱甯︽湁寰堝棰勫畾涔夌殑瀵硅薄鍜屽疄鐢ㄥ嚱鏁幫紝榪欎簺涓滀笢鐨勭洰鐨勬樉鐒舵槸鎶婁綘浠庝竴浜涢噸澶嶇殑鎵撳瓧涓В鏀懼嚭鏉?銆?br />浣跨敤$()鏂規(guī)硶
$() 鏂規(guī)硶鏄湪DOM涓嬌鐢ㄨ繃浜庨綣佺殑 document.getElementById() 鏂規(guī)硶鐨勪竴涓究鍒╃殑綆鍐欙紝灝卞儚榪欎釜DOM鏂規(guī)硶涓鏍鳳紝榪欎釜鏂規(guī)硶榪斿洖鍙傛暟浼犲叆鐨刬d鐨勯偅涓厓绱犮?br />姣旇搗DOM涓殑鏂規(guī)硶錛岃繖涓洿鑳滀竴絳廣備綘鍙互浼犲叆澶氫釜id浣滀負(fù)鍙傛暟鐒跺悗 $() 榪斿洖涓涓甫鏈夋墍鏈夎姹傜殑鍏冪礌鐨勪竴涓?Array 瀵硅薄銆?br /><HTML>
<HEAD>
<TITLE> Test Page </TITLE>
<script src="prototype-1.3.1.js"></script>
<script>
function test1()
{
var d = $('myDiv');
alert(d.innerHTML);
}
function test2()
{
var divs = $('myDiv','myOtherDiv');
for(i=0; i<divs.length; i++)
{
alert(divs[i].innerHTML);
}
}
</script>
</HEAD>
<BODY>
<div id="myDiv">
<p>This is a paragraph</p>
</div>
<div id="myOtherDiv">
<p>This is another paragraph</p>
</div>
<input type="button" value=Test1 onclick="test1();"><br>
<input type="button" value=Test2 onclick="test2();"><br>
</BODY>
</HTML>
鍙﹀涓涓ソ澶勬槸錛岃繖涓嚱鏁拌兘浼犲叆鐢╯tring琛ㄧず鐨勫璞D錛屼篃鍙互浼犲叆瀵硅薄鏈韓錛岃繖鏍鳳紝鍦ㄥ緩绔嬪叾瀹冭兘浼犱袱縐嶇被鍨嬬殑鍙傛暟鐨勫嚱鏁版椂闈炲父鏈夌敤銆?br />浣跨敤$F()鍑芥暟
$F()鍑芥暟鏄彟涓涓ぇ鏀舵榪庣殑"蹇嵎閿?錛屽畠鑳界敤浜庤繑鍥炰換浣曡〃鍗曡緭鍏ユ帶浠剁殑鍊鹼紝姣斿text box,drop-down list銆傝繖涓柟娉曚篃鑳界敤鍏冪礌id鎴栧厓绱犳湰韜仛涓哄弬鏁般?br /><script>
function test3()
{
alert(聽(tīng) $F('userName')聽(tīng) );
}
</script>
<input type="text" id="userName" value="Joe Doe"><br>
<input type="button" value=Test3 onclick="test3();"><br>
浣跨敤$A()鍑芥暟
$A()鍑芥暟鑳芥妸瀹冩帴鏀跺埌鐨勫崟涓殑鍙傛暟杞崲鎴愪竴涓狝rray瀵硅薄銆?br />榪欎釜鏂規(guī)硶錛岀粨鍚堣鏈被搴撴墿灞曚簡(jiǎn)鐨凙rray綾伙紝鑳芥柟渚跨殑鎶婁換浣曠殑鍙灇涓懼垪琛ㄨ漿鎹㈡垚鎴栨嫹璐濆埌涓涓狝rray瀵硅薄銆備竴涓帹鑽愮殑鐢ㄦ硶灝辨槸鎶奃OM Node Lists杞崲鎴愪竴涓櫘閫氱殑Array瀵硅薄錛屼粠鑰屾洿鏈夋晥鐜囩殑榪涜閬嶅巻錛岃鐪嬩笅闈㈢殑渚嬪瓙銆?br /><script>
function showOptions(){
var someNodeList = $('lstEmployees').getElementsByTagName('option');
var nodes = $A(someNodeList);
nodes.each(function(node){
alert(node.nodeName + ': ' + node.innerHTML);
});
}
</script>
<select id="lstEmployees" size="10" >
<option value="5">Buchanan, Steven</option>
<option value="8">Callahan, Laura</option>
<option value="1">Davolio, Nancy</option>
</select>
<input type="button" value="Show the options" onclick="showOptions();" >
浣跨敤聽(tīng)$H()鍑芥暟
$H()鍑芥暟鎶婁竴浜涘璞¤漿鎹㈡垚涓涓彲鏋氫婦鐨勫拰鑱斿悎鏁扮粍綾諱技鐨凥ash瀵硅薄銆?br /><script>
function testHash()
{
//let's create the object
var a = {
first: 10,
second: 20,
third: 30
};
//now transform it into a hash
var h = $H(a);
alert(h.toQueryString()); //displays: first=10&second=20&third=30
}
</script>
浣跨敤$R()鍑芥暟
$R()鏄痭ew ObjectRange(lowBound,upperBound,excludeBounds)鐨勭緝鍐欍?br />璺沖埌ObjectRange 綾繪枃妗ｅ彲浠ョ湅鍒頒竴涓叧浜庢綾葷殑瀹屾暣鎻忚堪. 姝ゆ椂錛屾垜浠繕鏄厛鏉ョ湅涓涓緥瀛愪互灞曠ず榪欎釜緙╁啓鑳戒唬鏇垮摢浜涙柟娉曞惂銆傚叾瀹冪浉鍏崇殑涓浜涚煡璇嗗彲浠ュ湪Enumerable 瀵硅薄鏂囨。涓壘鍒般?br /><script>
function demoDollar_R(){
var range = $R(10, 20, false);
range.each(function(value, index){
alert(value);
});
}
</script>
<input type="button" value="Sample Count" onclick="demoDollar_R();" >
浣跨敤Try.these()鍑芥暟
Try.these() 鏂規(guī)硶浣垮緱瀹炵幇褰撲綘鎯寵皟鐢ㄤ笉鍚岀殑鏂規(guī)硶鐩村埌鍏朵腑鐨勪竴涓垚鍔熸甯哥殑榪欑闇姹傚彉寰楅潪甯稿鏄擄紝 浠栨妸涓緋誨垪鐨勬柟娉曚綔涓哄弬鏁板茍涓旀寜欏哄簭鐨勪竴涓竴涓殑鎵ц榪欎簺鏂規(guī)硶鐩村埌鍏朵腑鐨勪竴涓垚鍔熸墽琛岋紝榪斿洖鎴愬姛鎵ц鐨勯偅涓柟娉曠殑榪斿洖鍊箋?br />鍦ㄤ笅闈㈢殑渚嬪瓙涓紝 xmlNode.text鍦ㄤ竴浜涙祻瑙堝櫒涓ソ鐢紝浣嗘槸xmlNode.textContent鍦ㄥ彟涓浜涙祻瑙堝櫒涓甯稿伐浣溿?浣跨敤Try.these()鏂規(guī)硶鎴戜滑鍙互寰楀埌姝ｅ父宸ヤ綔鐨勯偅涓柟娉曠殑榪斿洖鍊箋?br /><script>
function getXmlNodeValue(xmlNode){
聽(tīng)聽(tīng)聽(tīng) return Try.these(
聽(tīng)聽(tīng)聽(tīng)聽(tīng)聽(tīng)聽(tīng)聽(tīng) function()
Unknown macro: {return xmlNode.text;}
,聽(tīng)聽(tīng)聽(tīng)聽(tīng)聽(tīng)聽(tīng)聽(tīng) function() {return xmlNode.textContent
聽(tīng)聽(tīng)聽(tīng)聽(tīng)聽(tīng)聽(tīng)聽(tīng) );
}
</script>
]]>