javascript 正規表達式

ECMAScript基礎：

1. numberObject.toFixed(2); 填充到兩位小數

    var numberObject = new Number(9);

   numberObject.toFixed(2);// outputs 9.00

2. stringObject.lastIndexOf();

    "akescript.cn".indexOf("c") = 4;

   "akescript.cn".lastIndexOf("c") = 10; 

3. stringObject.localeCompare(stringObject2);stringObject按字母排序排在參數之前則傳回負數（-1）；相同傳回0 ；反之傳回正數（1）var string1= new String("ake");

   string1.localeCompare("ke") //outputs -1

   string1.localeCompare("ake") //outputs 0

   string1.localeCompare("a") // outputs 1

4. stringObject.slice(sNum,eNum);  類似于substring()方法，不同的是參數為負有效。

   "akescript".substring(3); // outputs "script"

   "akescript".slice(-6); // outputs "script"

5. delete object.name 移除已自定義的屬性或方法的引用

    var o = new Object;

   o.name = "ake87";

   alert(o.name); // outputs "ake87"

   delete o.name;

   alert(o.name); // outputs undefined

6. void對任何值都傳回undefined

   <a href="javascript:void(window.open('about:blank'));">Open</a> 

7. 一進制加号"+"将字元串的數字轉變為數字

   var sNum = "44"; var iNum = +sNum;

    alert(typeof iNum) ; //outputs "number"

8. undefined類型不能用于邏輯與或非的運算
9.  ===、!== 在比較之前不進行類型的轉換

10.  functionObject.length得到該函數預設的參數個數

    于2008-11-25。以後不知道還會不會這麼認真。。。

對象基礎

1. 數組可根據需要增加或減少項。增加隻需要把存放值的項放入下一個未使用的位置即可。

   var arr=new Array(3); var arr[4]="ake" // arr.length=5   arr[3]=null;

2. var str="green";    var arr = str.split(""); // arr = ["g","r","e","e","n"];
3. arr.slice(sNum,eNum); 同樣對數組有效。操作的不是字元而是數組的項。

4. array.pop();   删除數組的最後一項，并傳回該項的值。

   array.push(); 在數組的最後一個位置之後，添加一個數組項,參數為添加的項值

5. array.shift()/ unshift()；使用方法同上，不同的是操作的不是最後一項，而是第一項。

6. array.reverse();颠倒數組項的順序。

   array.sort(); 将數組想的值轉換為字元串，比較後按“升序”排列數組。

7. splice(sNum,dNum,items);數組中插入項。sNum：插入的位置，dNum：删除的項的個數，items：插入的項值。

   array.splice(0,2);删除數組的前兩項。

   array.splice(2,0,"ake","script"); 在數組第二項位置插入“ake”和“script”值。

   array.splice(2,1,"ake","script"); 删除數組的第二項，并插入項“ake”和“script”。

8. 應該盡量避免使用escape(); 若有需要可是使用encodeURI();

9. 得到一個在2－9之間的随機數。

   Math.floor(Math.random()*8 + 2); ==> Math.floor(Math.random()*total_Numbers + first_item_value);

10. 字元串了連接配接：建議使用join()方法，該方法比使用“+”連接配接字串更節約時間。

11. StringBuffer類：

    function StringBuffer(){this._strings  = new Array;}StringBuffer.prototype.append = function(str){this._strings.push(str);};StringBuffer.prototype.toString = function(){return this._strings.join("");};

12. 類的建立：使用構造函數和原型的方法。this+prototype。

    類的繼承：使用構造函數和原型鍊的方法。call()/append() + prototype

    構造函數——> 屬性； 原型——> 方法。

浏覽器中的JavaScript

1. moveBy(dx,dy);resizeBy(dw,dh);視窗相對移動或相對改變，參數為改變的值。

   moveTo(dx,dy);resizeTo(dw,dh);視窗移動到dx,dy;視窗大小變為寬dw高dh。

2. IE：window.screenLeft,window.screenTop——判斷視窗的位置

   document.body.offsetWidth(offsetHeight)擷取視視窗的大小（HTML頁面的區域）

   Mozilla,Opera,safari：window.screenX(screenY) 判斷視窗位置。

   innerWidth(Height) 判斷視視窗的大小。

   window.outerWidth(outerHeight) 判斷浏覽器視窗的大小。

3. alert（隻有OK按鈕）——confirm（OK和Cancel按鈕）——prompt（OK、Cancel按鈕和一個text文本框）

4. 在執行一組指定的代碼前等待一段時間，使用暫停（setTimeout）;若要反複執行某些代碼，則使用間隔（setInterval）

   js暫停方法：var TimeoutId = setTimeout(someFunction,1000);clearTimeout(TimeoutId);

5. 每當浏覽器遇到</script>時，它都假定代碼塊是完整的。（即使它出現在JavaScript字元串中），這時應該截斷它："</scr" + "ipt>"。
6. 當頁面完全載入後使用write()會抹去目前頁面的所有内容。
7. 對window.open打開的窗體寫入代碼使用指令：document.open();document.write();docuemnt.close();
8. location.href方法導航頁面會将新的URL位址記入“曆史”中。location.replace不會（about document.URL??）

9. location.reload();參數為true時，頁面将從伺服器重新載入；false時，從緩存中重新載入。

   若需要使用，最好把reload()放在最後一行。

10. cookieEnabled：說明是否啟用了cookie的boolean值。javaEnabled(),是否啟用了java

    注意不同浏覽器的可用性

11. screen.availWidth/availHeight：視窗可使用的螢幕寬／高度，其中包括作業系統元素（如windows的工具欄）

    screen.width/height ：螢幕的寬／高度，以像素計

12. screen.colorDepth：使用者表示顔色的位數

    2008-11-26

DOM基礎

1. 特性／方法        類型／傳回類型

   nodeName        String

   nodeValue        String

   nodeType        Number

   ownerDocument        Document

   firstChild        Node

   lastChild        Node

   childNodes        NodeList

   previousSibling        Node

   nextSibling        Node

   hasChildNodes()        Boolean

   attributes        NamedNodeMap*        包含了代表一個元素的特性的Attr對象；僅用于Element節點

   appendChild(node)        Node

   removeChild(node)        Node

   replaceChild(newnode,oldnode)        Node        在childNodes中的oldnode替換成newnode

   insertBefore(newnode,refnode)        Node        在childNodes中的refnode之前插入newnode

   *NamedNodeMap——同時用數值和名字進行索引的節點表；用于表示元素特性。

2. <html/>元素：var oHtml = document.documentElement;

   <head/>元素：var oHead = oHtml.firstChild || oHtml.childNodes[0] || oHtml.childNodes.item(0);

   <body/>元素：var oBody = oHtml.lastChild || oHtml.childNodes[1] || oHtml.childNodes.item(1);

3. Mozilla認為元素之間的空白都是Text節點，而IE則會忽略這些空白。
4. 使用nodeType特性檢驗節點類型。

5. getNamedItem(name)——傳回nodeName屬性值等于name的節點；

   removeNamedItem(name)——删除nodeName屬性值等于name的節點；

   setNamedItem(node)——将node添加到清單中，按其nodeName屬性進行索引；

   item(pos)——像NodeList一樣，傳回在位置pos的節點；

   這些方法都是傳回一個Attr節點，而非特性值。——貌似比較複雜的方法。。。

6. getAttribute(name)——等于attributes.getNamedItem(name).value;

   setAttribute(name,newvalue)——等于attributes.getNamedItem(name).value=newvalue;

   removeAttribute(name)——等于attributes.removeNamedItem(name)。

   相對上一種方法好直覺的多，也簡潔的多。

7. document.getElementsByTagName("*")傳回document中包含的所有元素。

   當參數是一個星号的時候，IE6.0并不傳回所有的元素，必須使用document.all來替代它

8. document.getElementsByName();傳回name值等于指定值的所有元素。

   但在IE6.0和Opera7.5在這個方法使用上還存在一些錯誤。它們還會傳回id等于指定名稱的元素。它們還僅僅檢查<input/>和<img/>元素。

9. 對于document.getElementById()方法在IE6.0中會傳回與給定的ID比對的name特性的元素。

10. 方法        描述

    createAttribute(name)        用給定名稱name建立特性節點

    *createCDASection(text)        用包含文本text的文本子節點建立一個CDATASection

    createComment(text)        建立包含文本text的注釋節點

    createDocumentFragment()        建立文檔碎片節點（什麼東西？？）

    createElement(tagname)        建立标簽名為tagname的元素

    *createEntityReference(name)        建立給定名稱的實體引用節點

    *createProcessingInstruction(target,data)        建立包含給定target和data的PI節點

    createTextNode(text)        建立包含文本text的文本節點

    *隻有Mozilla浏覽器支援此方法。

11. 所有的的DOM操作必須在頁面完全載入之後才能進行。當頁面正在載入時，要向DOM插入相關代碼是不可能的，因為在頁面完全下載下傳到用戶端機器之前，是無法完全建構DOM樹的。
12. 一旦把節點添加到document.body（或者它的後代節點）中，頁面就會重新整理并反映出這個變化。是以，若要向document添加大量資料時會是頁面不斷的重新整理變化。想要避免這種情況，可以使用建立文檔碎片的方法：createDocumentFagment();将要添加的節點先appendChild()添加到這個建立的文檔碎片對象上，然後一次性将文檔碎片以appendChild方法添加到document.body中。前一個appendChild()的調用實際上并不是把文檔碎片節點本身追加到<body/>元素中，而是僅僅追加碎片中的子節點。（？）
13. Attribute的方法屬于核心的DOM方法；而如oA.href的直接引用屬性的方法屬于HTML DOM的方法。
14. setAttribute()在IE上有些許問題，是以最好使用HTML DOM的方法，且個人覺得此種方法更直覺和簡潔。

15. <table/>元素的方法：

    caption——指向<caption/>元素（如果存在）

    tBodies——<tbody/>元素的集合

    tFoot——指向<tfoot/>元素（如果存在）

    tHead——指向<thead/>元素（如果存在）

    rows——表格中所有行的集合

    createTHead()——建立<thead/>元素并将其放入表格

    createTFoot()——建立<tfoot/>元素并将其放入表格

    createCaption()——建立<caption/>元素并将其放入表格

    deleteTHead()——删除<thead/>元素

    deleteTFoot()——删除<tfoot/>元素

    deleteCaption()——删除<caption/>元素

    deleteRow(position)——删除指定位置上的行

    insertRow(position)——在rows集合中的指定位置插入一個新行

16. <tbody/>元素添加以下内容：

    rows——<tbody/>中所有行的集合

    <tr/>元素添加以下内容：

    cells——<tr/>元素中所有的單元格

    deleteCell(position)——删除給定位置上的單元格

    insertCell(position)——在cells集合的給定位置插入一個新的單元格

17. 以上方法僅僅屬于DOM level1的部分。DOM level2中的功能：DOM周遊（NodeIterator）和TreeWalker方法。

    目前隻有Mozilla和其他少數浏覽器支援DOM level2以上的功能，是以這些方法可以暫時不予以考慮。

18. implementation對象用來确定給定的DOM實作到底支援DOM的哪些部分。用document.implementation.hasFeature("要檢查的特征","特征的版本")方法來檢驗。

    但這個方法有其明顯的缺陷——DOM實作是否與DOM标準一緻是由去進行實作的人（或公司）決定的。故該方法的結果其實并不一定是完全真實的，包括Mozilla。

1. sString:被指定的要比對的字元串。

   var reg=/regstr/gi；建立個RegExp對象。regstr：正規表達式；g：全局比對；i：不區分大小寫。

   reg.test(sString);如果給定字串（隻有一個參數）比對該模式，則傳回true，否則傳回false

   reg.exec(sString);傳回一個數組。數組中的第一個條目是第一個比對；其他的反向引用。（？）

   sString.match(reg);該方法傳回一個包含在字元串中的所有比對的數組。

   sString.search(reg);傳回在字元串中出現的一個比對的位置（int）。

2. sString.replace(reg,reStrOrFunc);第二個參數可以是字元串或者函數（應該要有傳回值吧？）

   sString.split(reg);參數可以是正規表達式，如/\,/：“,”

3. 元字元：( [ { \ ^ $ | ) ? * + .

4. 特殊字元：

   \t         制表符

   \n         換行符

   \r         回車符

   \f         換頁符

   \a        alert字元

   \e        escape字元

   \cx      與X相對應的控制字元

   \b        回退字元

   \v        垂直制表符

   \0        空字元

5. 字元類：

   以下内容是個人的了解，如果您覺得其内容有誤導他人的嫌疑，請留言相告，我會修改的。

   [abc]，簡單類：比對方括号中任一字元，a或b或c；

   ^，負向類：是非的意思，如[^ab]表示比對不包含a或b的情況；

   [a-z]，範圍類：比對從a到z的字元。注意該例子不包含A-Z之間的字元，或者你可以使用i選項；

   組合類：是由多種類組合而成的字元類。如：[a-k7-8\n]，比對所有a-k以及7-8的字元，以及一個換行符；

6. 預定義類： 等同于： 比對

   .                  [^\n\r]                除了換行和回車之外的任意字元

   \d                [0-9]                 數字

   \D               [^0-9]                非數字字元

   \s                [ \t\n\x0B\f\r]      空白字元

   \S               [^ \t\n\x0B\f\r]     非空白字元

   \w               [a-zA-Z_0-9]     單詞字元（英文字元、數字和下劃線）

   \W              [^a-zA-Z_0-9]   非單詞字元

7. 量詞：

   簡單量詞：

   ?  出現零次或一次

   *  出現零次或多次（任意次數）

   +  出現一次或多次（至少出現一次）

   {n}  出現n次（固定次數）

   {n,m} 至少出現n次，但不超過m次

   {n,} 至少出現n次

   2008.12.1

8. 貪婪的、惰性的和支配性的量詞

   貪婪量詞：先看整個字元串是否比對。若沒有發現比對，則去掉最後字元串的最後一個字元再嘗試比對，如此循環，直到發現一個比對或者字元串不剩一個字元。目前為止讨論的都是貪婪的量詞。

   惰性量詞：先看字元串中的第一個字母是否比對。若沒有發現比對，則讀入下一個字元進行比對嘗試，如此循環，直到發下一個比對或者整個字元串都檢查過也沒有比對。它與貪婪量詞的工作方式恰好相反。

   支配量詞：隻嘗試比對整個字元串，若沒有發現比對，停止嘗試。（傳回false）

   貪婪         惰性         支配         描述

   ?               ??            ?+           零次或一次出現

   *                *?             *+           零次或多次出現

   +               ++            ++           一次或多次出現

   {n}            {n}?          {n}+        恰好n次出現

   {n,m}       {n,m}?    {n,m}+    至少n次至多m次出現

   {n,}           {n,}?        {n,}+       至少n次出現

   PS：浏覽器對支配量詞的支援還很不完善。IE和Opera不支援支配量詞，使用會抛出一個錯誤。Mozilla不會産生錯誤，但它會将支配量詞看作是貪婪的。

9. 分組：通過使用一系列小括号()包圍一系列字元、字元類以及量詞來使用。

    String.prototype.trim = function(){var reg = /^\s+(.*?)\s+$/;return this.replace(reg,$1);}//該方法與其他語言中的trim()方法一樣，用以除去字元串頭尾的空格。

10. .1：在完成表達式計算後，每個分組都被存放在一個特殊的地方以備将來使用。這些存儲在分組中的特殊值，稱之為反向引用。如：(a?(b?(c?))),第一個反向引用為(a?(b?(c?)))，第二個為(b?(c?))，第三個為(c?)。

11. .2：在使用正規表達式對象的test()、match()或search()方法後，反向引用的值可以從RegExp構造函數中獲得。如：

    var sString = "#123456789";

    var reg = /#(\d+)/;

    reg.test(sString);

    alert(RegExp.$1);//outputs "123456789"

    還可以直接在定義分組的表達式中包含反向引用。如 /dogdog/ === /(dog)\1/

    .3：反向引用可以用在String對象的replace()方法中：

    var sString = "1234 56789";

    var reg = /(\d{4}) (\d{4})/;

    var sNew = sString.replace(reg,"$2 $1");

    alert(sNew);//outputs "5678 1234";

12. 候選操作符，“|”：類似于或操作。

    var reg = /badword|otherbadword/gi;

    var sString = "this is a string using badword1 and badword2";

    var sNew = sString.replace(reg,"****");

    alert(sNew);//outputs "this is a string using ****1 and ****2";//屏蔽敏感字詞

13. 建立反向引用的分組稱之為捕獲性分組，而非捕獲性分組則無需存儲結果；非捕獲性分組建立方法：(?: /*..*/ )

    String.prototype.stripHTML = function(){var reg=/<(?:.|\s)*?>/g;return this.replace(reg,"");}//剔除字串中的HTML标簽

    var sTest = "<b>this is a test string</br>";

    alert(sTest.stripHTML());//outputs "this is a test string"

14. 前瞻：告訴正規表達式運算器向前看一些字元而不移動其位置，簡單講：當某個特定的字元分組出現在另一個字元串之前時，才去捕獲它（或比對它）。

    前瞻存在正向前瞻和負向前瞻。

    正向前瞻檢查的是接下來出現的是不是某個特定字元集。而負向前瞻則檢查接下來的不應該出現的特定字元集。（兩則相對是非的關系，相關字元是否相連）

15. 建立正向前瞻要将模式放在(?=和)之間。注意這不是分組，分組不會考慮前瞻的存在。

    var sString1 = "bedroom";

    var sString2 = "bedding";

    var reg = /(bed(?=room))/;

    alert(reg.test(sString1));//outputs "true"

    alert(RegExp.$1);    //outputs "bed"//引用不包含"room"

    alert(reg.test(sString2));//outputs "false"

    以上為正向前瞻，建立負向前瞻要将模式放在(?!和)之間。上個例子用負向前瞻将比對bedding。

    盡管JavaScript支援正規表達式前瞻，但它不支援後瞻。後瞻可以比對這種模式：“比對b當且僅當它前面沒有a”。

16. 邊界      描述

    ^            行開頭

    $           行結尾

    \b         單詞的邊界

    \B         非單詞的邊界

17. 多行模式

    在正規表達式後面添加m選項：/(\d)/gm。将對每行進行比對而不是隻對全局。多行模式會改變^和&的邊界行為。

18. RegExp對象的執行個體屬性：

    global——Boolean值，表示g（全局選項）是否已設定。

    ignoreCase——Boolean值，表示i（忽略大小寫選項）是否已設定。

    lastIndex——整數，代表下次比對将會從哪個字元位置開始（隻有當使用exec()或test()函數才會填入，否則為0）。

    multiline——Boolean值，表示m（多行模式選項）是否已設定。

    source——正規表達式的源字元串形式。例如，表達式/[ba]*/的source将傳回“[ba]*”。

19. 屬性lastIndex表示正規表達式在某個字元串中停止之前，查找了多遠：

    var sString="bbq is short for barbecue";

    var reg=/b/g;

    reg.exec(sString);

    alert(reg.lastIndex);//outputs "1"

    alert(reg.lastIndex);//outputs "2"

    alert(reg.lastIndex);//outputs "18"

    alert(reg.lastIndex);//outputs "21"

    可以自行設定lastIndex；

20. 靜态的RegExp屬性：

    長名                短名        描述

    input                 $_        最後用于比對的字元串（傳遞給exec()或test()的字元串）

    lastMatch        $&        最後比對的字元

    lastParen        $+        最後比對的分組

    leftContext       $`        在上次比對的前面的字串

    multiline          $*        用于指定是否所有的表達式都使用多行模式的布爾值

    rightContext    $'        在上次比對之後的字串

    這些屬性可以告訴你，關于剛使用exec()或test()完成的比對的一些特定資訊

    var sString = "this has been a short,short summer";

    var reg  = /(s)hort/g;

    alert(RegExp.input);        //outputs "this has been a short,short summer"

    alert(RegExp.leftContext);        //outputs "this has been a"

    alert(RegExp.rightContext);        //outputs ", short summer"

    alert(RegExp.lastMatch);        //outputs "short"

    alert(RegExp.lastParen);        //outpus "s"

21. IE和Opera并不支援RegExp.multiline，是以最好單獨的對每個表達式設定m選項而不要直接設定這個标記。

22. 日期驗證函數：

    function isValidDate(str){   var reg=/(?:0[1-9]|[12][0-9]|3[01])\/(?:0[1-9]|1[0-2])\/(?:19|20\d{2})/;    return reg.test(str);}

    alert(isValidDate("5/5/2004"));        //outputs "true"

    alert(isValidDate("5/13/2004"));        //outputs "false"

23. 電子郵件位址驗證函數：

    function isValidEmail(str){      var reg=/^(?:\w+\.?)*\w+@(?:\w+\.?)*\w+$/;     return reg.test(str);}

    alert(isValidEmail("ake87#126.com"));        //outputs false