『壹』 前端錯誤Uncaught TypeError: Cannot read property 'length' of null錯誤怎麼處理
通過統計資料庫中的1000多個項目,我們發現在 JavaScript 中最常出現的錯誤有10個。下面會向大家介紹這些錯誤發生的原因以及如何防止。
1. Uncaught TypeError: Cannot Read Property
這是 JavaScript 開發人員最常遇到的錯誤。當你讀取一個屬性或調用一個未定義對象的方法時,Chrome 中就會報出這樣的錯誤。
導致這個錯誤發生的原因有很多,常見的一種情況是在渲染 UI 組件時,不正確地初始化狀態。我們來看一個真實的應用程序中發生這種情況的例子。
以上代碼有兩個重要方面:
一是組件的狀態(例如 this.state),在開始生命周期之前是 undefined 狀態。
二是當通過非同步的方式獲取數據時,無論是在構造函數中 componentWillMount 中,還是在構造函數中提取 componentDidMount,組件在數據載入之前至少會渲染一次。當檢測首次渲染時,會發現 this.state.items 是未定義的。此時就會出現一個錯誤 -「Uncaught TypeError: Cannot read property 『map』 of undefined" in the consol」。
解決的方法很簡單:在構造函數中使用合理的默認值進行狀態初始化。
2. TypeError: 『undefined』 Is Not an Object (evaluating...)
這是在 Safari 中讀取屬性或調用未定義對象上的方法時發生的錯誤,這與 Chrome 的上述錯誤基本相同,只是 Safari 使用不同的錯誤消息。
3. TypeError: Null Is Not an Object (evaluating...)
這是在 Safari 中讀取屬性或調用空對象上的方法時發生的錯誤。
在實際情況中,導致這種錯誤的原因之一是:在元素載入之前,就嘗試在 JavaScript 中使用 DOM 元素。這是因為 DOM API 對於空白的對象引用返回 null。
任何執行和處理 DOM 元素的 JS 代碼,都應該在創建 DOM 元素之後執行。JS 代碼按照 HTML 中的規定自上而下進行解釋。因此,如果在 DOM 元素之前存在標簽,則腳本標簽內的 JS 代碼就會在瀏覽器分析 HTML 頁面時執行。如果在載入腳本之前尚未創建 DOM 元素,就會出現這樣的錯誤。
在這個例子中,我們可以通過添加一個事件偵聽器來解決這個問題,事件偵聽器會在頁面准備就緒時通知我們。一旦 addEventListener 被觸發,該 init( ) 方法就可以使用 DOM 元素。
4. (unknown): Script Error
當未捕獲的 JavaScript 錯誤違背跨邊界原則時,就會發生腳本錯誤。例如,如果將 JavaScript 代碼託管在 CDN 上,則任何未被捕獲的錯誤(通過 window.onerror 處理程序發出的錯誤,而不是 try-catch 中捕獲到的錯誤)將僅報告為「腳本錯誤」。這是瀏覽器的一種安全措施,主要用於防止跨域傳遞數據的情況出現。
要獲取真實的錯誤消息,需要執行以下操作:
Access-Control-Allow-Origin
將
Access-Control-Allow-Origin 設置為 *, 表示可以從任何域正確訪問資源。* 如有必要,也可以用自己的域名進行替換,例如:
Access-Control-Allow-Origin: www.example.com。
以下是在各種環境中設置的一些示例:
在腳本標簽上設置crossorigin =「anonymous」
在你的 HTML 源代碼中,為每一個腳本設置
Access-Control-Allow-Origin,在設置 SCRIPT 標簽中,設置 crossorigin="anonymous"。在將 crossorigin 屬性添加到腳本標簽之前,請確保正在向腳本文件發送 header。在 Firefox 中,如果 crossorigin 屬性存在但 Access-Control-Allow-Origin 標題不存在,則腳本不會執行。
5. TypeError: Object Doesn』t Support Property
當調用未定義的方法時,IE 中會發生這樣的錯誤。
這相當於 Chrome 中的 「undefined』 is not a function」 錯誤。對於相同的邏輯錯誤,不同的瀏覽器可能會有不同的錯誤消息。
這是在 IE 的 Web 應用程序中使用 JavaScript 命名空間出現的一個常見問題。出現這種情況的絕大部分原因是IE無法將當前名稱空間內的方法綁定到this關鍵字。例如,如果你有 JS Rollbar 方法的命名空間 isAwesome。通常,如果位於 Rollbar 命名空間內,則可以使用以下語法調用該 isAwesome 方法:
6. TypeError: 『undefined』 Is Not a Function
當調用未定義的函數時,Chrome 中就會發生這樣的錯誤。
執行上面的代碼會導致以下錯誤:「Uncaught TypeError: undefined is not a function。」 發生以上錯誤的原因是,當你調用 setTimeout( ) 時,實際上是在調用 window.setTimeout( ),傳遞給 setTimeout( ) 的匿名函數是在窗口對象的上下文中定義的,而該窗口對象沒有 clearBoard( ) 方法。
符合舊版瀏覽器的解決方案是以變數的方式簡單地將引用保存在 this 中,然後通過閉包繼承。
『貳』 求前端人員來解惑,調測的js代碼錯誤,chrome網頁會卡住
代碼裡面死循環之內的,直接把內存都給你飈滿了,chrome有那個心給你報錯卻沒那個力,它自己都動不了達...
你把卡住的瀏覽器關了,進程結束,內存滿血復活,於是你也不仔細改改,又弄段代碼去卡死瀏覽器,我個人覺得你這個人就是個死循環。
『叄』 網頁顯示javascript錯誤..怎麼解決
解決辦法:
1、打開IE瀏覽器,在IE瀏覽器上方的菜單欄中找到工具項,然後選擇工具項中的「Internet選項」;
『肆』 前端新人小白求助!!!js總是報錯:not of type 'Node'!!!
oOtionl.removeChild('oOtionl_div[i]'); 這句錯了 'oOtionl_div[i]' 是個字串 不是一個node (節點對象) 所以 不能作為 removeChild的參數使用 把參數的引號去掉 改成
oOtionl.removeChild(oOtionl_div[i]); 試一下