【轉載】工做中遇到的js問題以及問題的解決方案

Js執行機制，主線程，和隊列任務：

 

// 不管js中有多少代碼，最終都是要經過js引擎去執行

 

// 異步代碼都是瀏覽器引擎去控制的，（定時器計時，和ajax請求，都是由瀏覽器引擎控制的）也就是管定時器秒數走，還有請求ajax和捕捉事件發生

 

當異步代碼的事件觸發了（好比定時器時間到了，用戶觸發了事件，還有ajax請求成功了），那麼就會把事件的回調函數，放到隊列任務中，當js引擎空閒後，就會去把隊列任務中的函數，拿到js引擎中，讓js引擎去執行。//:備註：定時器，還有ajax請求，都是瀏覽器引擎去操做的，每當js引擎在執行的時候遇到一個定時器/ajax，js引擎就會告訴瀏覽器去開一個線程去控制定時器/ajax，，而後js引擎就會跳過ajax/定時器，接着執行下面的代碼；

 

用戶的操做事件（好比點擊，等等），都是有一個單獨的引擎實時監控着；名稱叫作，瀏覽器事件引擎，當用戶觸發了頁面的某個元素後事件後，瀏覽器事件引擎就會把事件所對應的回調函數，放到任務隊列中，等待js引擎去執行

 

元素. body.scrollTop = 300；網頁被卷出去的高或者左，爲異步， 這句話的概念是會先負值，但滾動條不會立馬滾動，而是會1秒以後滾動；

 

備註：以上3中(定時器，ajax，和用戶的行爲所觸發的事件 )，都是屬於異步

重要：異步的含義是：瀏覽器從新開個線程，主線程接着往下執行。

 

獲取元素的offsetWidth，clientWidth，scrooHeight的注意事項：

      2點影響條件：

       1，建立的元素，必須把他放進html結構中，才能獲取到寬度;

       2 , 第二，元素必須是顯示的，若是元素是display:none的話，則獲取不到;

       InnerHTML = 值，只接受字符串，系統會將字符串轉換爲dom元素對象;

       Window.onload ；當頁面有（異步事件），往頁面渲染dom元素的時候，若是js須要獲取dom元素的話，js外圍必須包上window.onload  = function(){

          獲取元素代碼

       }

  數組和對象的相同點，不管是js仍是php：

　　數組和對象都是key，value形式的;

　　數組[key] 獲取到value；

　　對象.key 獲取到value;

　　換句話說，一個key對應一個value

 

帶肯定，取消按鈕的彈出框，點擊肯定將執行事件的默認執行， 取消，則不執行事件的默認行爲： 

     若是你寫成onclick="function(){returtn confirm('彈出框所顯示的文字 ')}"也能夠,可是默認老是是返回True,肯定、取消都無效.

     若是你寫成onclick="function(){return confirm(' 彈出框所顯示的文字')}"加了return就至關於加了一個肯定、取消的開關,若是是肯定,就return True,反之return False；

     Return true 就會執行事件的默認行爲

     Return false； 就會取消事件的默認行爲;

 

From表單提交注意事項：

　　Form表單中加上enctype="multipart/form-data" 說明，後臺能夠接受到file上傳的圖片，若是不加enctype="multipart/form-data" 後臺則沒法獲取到傳給後臺的圖片;

　　注意點：

　　1： 同一個file控件<input type=」file」/> 連續重複讀取了同一個文件，則第二次及之後，則讀取不出來,讀取出來就是個空字符串，

　　2：一個form表單中，有多個file控件<input type=」file」 name=」file」/> 。而且控件的name名字都同樣，那麼當使用form表單提交的時候，提交的是最後一個讀取的文件（也就是最後一個操做的file控件他所            讀取的文件）。

　　3：當使用file文件控件 上傳（圖片或者其餘文件）的時候，是先把（圖片或者其餘文件）存到了file文件控件中，而後才傳送給後臺，當file文件控件 存入了用於上傳的文件後，就會觸發file控件的onchange事件;

      注意：以上僅僅是將文件保存到了file文件控件中，還並無提交給後臺；

 

Textarea標籤 多行文本控件：注意事項

 

　　1：不支持直接在html中直接寫value;就是寫了也不會顯示value的值;

　　2 : 能夠用js動態寫value，這樣則會顯示;

　　3: 支持value屬性和innerHTML屬性,不管寫那個，都是會顯示寫入的文本；

　　4: value的優先級要大，value能夠覆蓋innerhtml;但innerhtml沒法覆蓋value

　　5: 使用value能夠獲取innerhtl的值，但innerHTML ，則沒法獲取value的值;

　　6:Textarea.inerhtml中，只容許直接寫文本，不容許寫標籤，就算是寫了標籤也不會解析成html元素，另外，文字在textarea中是怎麼寫的，他就怎麼顯示，例如：

 　　

　　頁面上顯示爲

 　　

 

　　Js中獲取textarea.innerHTML/value 中的文字，顯示爲

 　　

　　7 : 往textarea元素中寫入的時候，建議用inenrHTML, 獲取的時候用value;

多個script標籤之中的變量或者函數互相調用詳解

 

          多個script標籤共用一個window對象，每一個script標籤裏面代碼執行完畢以後，纔會進入下一個script標籤中去執行，而且每一個script標籤，都會有預解析的狀況，  但預解析的時候，都是提高到第1個script標籤的頂部，不管下方到多少個script標籤，變量提高的時候，都是提高到第1個script標籤的頂部。

           第0個script標籤裏面也能夠用任何script標籤裏面的變量或者函數，只要代碼執行的時候，變量和函數，已經被聲明，那麼就可使用；

          再次提醒：變量和函數提高的時候，都是提高到第0個script標籤的頂部。

 　　

渲染頁面技巧

 

　　1：A視圖中的js 、css 放到A視圖中，B視圖中的js 、css放到B視圖中；

 

　　2：A頁面中的ajax請求B視圖中的html、css、js, 而後渲染到A頁面中，實現局部（更新A頁面）；

 

　　3: 前後臺執行，再前臺執行；

 

　　4：瀏覽器是執行html，css，js的;

 

　　5 : 若是將css寫在style標籤中， js寫在script標籤則css和js也屬於html，瀏覽器執行的時候，是先將style標籤中的css和script標籤中的js當成html渲染到頁面上，而後再將style標籤中css按照樣式執行，以及script標籤中js按照行爲執行。

 

 　　若是css是用style標籤引入到頁面中的，則就不會將style標籤引入的css當成html來渲染到頁面中了， 則是直接當成樣式執行。

 

 　　若是js是用script標籤引入到頁面中的，則就不會將script標籤引入的js當成html來渲染到頁面中了， 則是直接當成行爲執行。

 

js解決 獲取瀏覽器url中文編碼問題：

 

　　decodeURIComponent(   %E6%9C%AC  );解碼， 解成中文的;

　　encodeURIComponent( 文字); 編碼， 將中文文字給編碼，編碼後變成這種形式-》%E6%9C%AC。

 

document.write()方法能夠用在兩個方面：

 

 1.頁面載入過程當中，用腳本加入新的頁面內容：

    

  2.用延時腳本建立本窗口或新窗口的新的內容 , 替換掉窗口以前的全部內容：

       答： 在載入內容渲染完畢後（不包括全部js），瀏覽器輸出流自動關閉。在此以後，任何一個對當前頁面進行操做的document.write()方法將打開—個新的輸出流，它將清除當前頁面內容(包括源文檔的任何變量或值)。所以，假如但願用腳本生成的HTML替換當前頁面，就必須把HTML內容鏈接起來賦給一個變量，使用一個document.write()方法完成寫操做。