本质原因是js 没有判断dom 是否加载完毕

其实就是在dom 加载完毕之后处理事件

wv.getSettings().setDomStorageEnabled(true);

转自 蛙齋  http://wazai.net/2969/android-webview-error-uncaught-typeerror-cannot-call-method-getitem-of-null-at

Android WebView 這個元件,發現整個速度跟瀏覽器完全沒得比,包括内建瀏覽器、Chrome、Firefox、Opera …。每種瀏覽器的速度都比 WebView 快上許多 … 小蛙跟許多人一樣巴不得把 chrome 塞進 app 裡面!網路上有些人推薦 chromeview,不過有一些 bug 以及對於比較低 API 的 app 是沒辦法使用的!這篇記錄小蛙遇到 WebView 在載入網頁的時候遇到 Uncaught TypeError 錯誤的解決方法。

結構越複雜的網頁就越慢 … 但是特別的是奇摩拍賣手機版網頁,竟然也可以慢到如此誇張 … 不怪 WebView,因為就連直接用 Chrome 開啟都要花很長的一段時間,問題出在整個頁面載入完成之後,又做了大量的 DOM 操作,像是動態選單建立,動態元件 … 等等。奇摩拍賣放進了太多功能,造成整個效能低落 …

當時小蛙還異想天開的以為是 WebViewClient.onReceivedError 或是 WebViewClient.onLoadResource 丟出這個令人覺得大心的錯誤,如果直接把網址貼上瀏覽器會發生錯誤,把後面的 :1 刪掉就可以正常讀取該 js,那只要在 WebViewClient.onLoadResource 讀取資源的時候,把 :1 這種造成錯誤的字元過濾掉就好了,把動作加上去之後發現,事情絕對沒有笨蛋想的那麼簡單 … 這個錯誤的拋出跟上面提到那兩個 function 一點關係都沒有 … 錯誤依然存在,跑不出來的功能依然跑不出來!

Google 一下發現有很多人都遇到這個問題,解決的方法很簡單,這個錯誤的引起是因為剛剛一開始有提到該網頁是在 DOM 載入之後才開始對 DOM 元素進行操作,這邊有提到 WebSettings.setDomStorageEnabled(boolean)

1
2
public synchronized void setDomStorageEnabled (boolean flag)
Sets whether the DOM storage API is enabled. The default value is false.

預設是不做 DOM 儲存的動作,也就是說在整個網頁載入完成之後並不把 DOM tree 儲存起來,所以導致後續對於 DOM 元素的操作,因為找不到這棵 tree 而發生錯誤,只要加上以下這行

1
wv.getSettings().setDomStorageEnabled(true);

問題就解決了!這次使用 WebView 來做一些東西加上整個切換成 fragment 的方式,應該會遇到不少問題!

Android WebView Error – Uncaught TypeError: Cannot call method ‘getItem’ of null at的更多相关文章

  1. ExtJs 4.2.1 报错:Uncaught TypeError: Cannot call method 'getItems' of null

    做项目的时候遇到这个问题,搞了一上午终于解决了,让我们看看是什么问题: buttons: [ { text: '保存', icon: '../../../Images/extjs/disk.png', ...

  2. JsBridge "Uncaught TypeError: Cannot call method 'callHandler' of undefined", source

    h5和原生结合开发app越来越流行.其实就是webview 的js调用native的方法.也就是需要搭建一个桥.这样的桥早就有人搭建好了,那就是jsbridge. git地址: https://git ...

  3. “Uncaught TypeError: Cannot call method 'createChild' of undefined" 问题的解决

    Uncaught TypeError: Cannot call method 'createChild' of undefined 我在使用Ext 4.1.1做grid.Panel,然后chrome爆 ...

  4. Uncaught TypeError: Cannot read property 'insertAdjacentHTML' of null

    在开发Ext 项目中如果遇到 Uncaught TypeError: Cannot read property 'insertAdjacentHTML' of null 这个错误,检查下renderT ...

  5. Uncaught TypeError: Cannot set property 'innerHTML' of null

    学习Chrome插件时,要在弹出页面中显示当前时间,结果怎样也显示不出来 看了 http://www.cnblogs.com/mfryf/p/3701801.html 这篇文章后感悟颇深 通过调试发现 ...

  6. Three.js three.js Uncaught TypeError: Cannot read property 'getExtension' of null

    在调试Three.js执行加载幕布的时候,突然爆出这个错误three.js Uncaught TypeError: Cannot read property 'getExtension' of nul ...

  7. JavaScript Uncaught TypeError: Cannot read property 'value' of null

    用 JavaScript 操作 DOM 时出现如下错误: Uncaught TypeError: Cannot set property 'value' of null Uncaught TypeEr ...

  8. 前台报错:Uncaught TypeError: Cannot read property '0' of null

    错误现象: var div1=mycss[0].style.backgroundColor;  //这一行提示360和chrome提示:Uncaught TypeError: Cannot read  ...

  9. 解决sweetalert 无故报错 elem.className.replace Uncaught TypeError: Cannot read property 'className' of null

    今天碰到这么一个问题,在使用sweetalert的时候时有时无会报错 elem.className.replace Uncaught TypeError: Cannot read property ' ...

随机推荐

  1. javascript基础学习(一)

    javascript输出: javascript通过不同的方式来显示数据: (1)windows.alert()弹出警告框: (2)document.write()将方法写入HTML文档中: (3)i ...

  2. angular template浅析

    在我们浏览的页面中有大的网站,也有中小型网站,类型不同其中的页面也就不同,但是纵观大部分的网页是否有什么相同的地方呢?如果浏览的是一般的门户网站或者是什么小型的页面的话这种感觉就不是很明显,但是如果关 ...

  3. 51nod建设国家

    小C现在想建设一个国家.这个国家中有一个首都,然后有若干个中间站,还有若干个城市. 现在小C想把国家建造成这样的形状:选若干(可以是0个)的中间站把他们连成一条直线,然后把首都连在这一条直线的左端.然 ...

  4. yield用法的一点理解

    yield 关键字与 return 关键字结合使用,向枚举器对象提供值.这是一个返回值,例如,在 foreach 语句的每一次循环中返回的值.yield 关键字也可与 break 结合使用,表示迭代结 ...

  5. Poj 3667

    这是第一题线段树的区间合并的题: 这类的题用于求连续的最长长度什么的: 这题我看的是一篇比较不错的博客: 我把我的理解注释在代码里了: #include <iostream>#includ ...

  6. 拓扑排序-DFS

    拓扑排序的DFS算法 输入:一个有向图 输出:顶点的拓扑序列 具体流程: (1) 调用DFS算法计算每一个顶点v的遍历完成时间f[v] (2) 当一个顶点完成遍历时,将该顶点放到一个链表的最前面 (3 ...

  7. google zxing 二维码扫描(android client分析)

    一.总体架构 二.架构分析 1. com.google.zxing.client.android AmbientLightManager 环境光线管理 Detects ambient light an ...

  8. 编译内核出错:invalid option `abi=aapcs-linux' 解决办法

    出现此问题的原因是由于kernel feature中选中了Use the ARM EABIto compile the kernel引起的,有两各解决办法: 1)换编译器为arm-linux-gcc ...

  9. Unable to find the ncurses libraries or the required header files解决

    问题: 解决方法: sudo apt-get install ncurses-dev 参考:Unable to find the ncurses libraries or the required h ...

  10. Node.js全局对象

    Node.js的全局对象是具有全局性的,它们可在所有的模块中应用.我们并不需要包括这些对象在应用中,而可以直接使用它们.这些对象的模块,函数,字符串和对象本身,如下所述. __filename __f ...