用webview写界面，加载本地js,js,html文件

秒速五厘米 2022-08-09 18:57 192阅读 0赞

原地址：[http://www.cnblogs.com/sleeptothedeath/p/3700494.html][http_www.cnblogs.com_sleeptothedeath_p_3700494.html]

以jquery mobile为例

1.在android界面拖入一个webview，然后添加一个internet权限

按 Ctrl+C 复制代码

2.  在assets目录里面放入js,css,html资源文件

![300128541585496.jpg][]

3.在写本地html的时候引入assert里的对应路径

![ExpandedBlockStart.gif][]

![复制代码][copycode.gif]

<!DOCTYPE html>  
    <head>  
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
    <meta name="viewport" content="width=device-width, initial-scale=1">   
    <title> 标题 </title>  
    <link rel="stylesheet" type="text/css" href="file:///android_asset/css/jquery.mobile-1.4.2.min.css">  
    <script src="file:///android_asset/js/jquery-1.7.1.min.js"></script>  
    <script src="file:///android_asset/js/jquery.mobile-1.4.2.min.js"></script>  
    </head>  
    <body>  
      
      
    　<div data-role="page">  
        　<div data-role="header">  
        　　<h1>My Title</h1>  
        　</div>  
           
        　<div data-role="content">  
            <ul data-role="listview" data-inset="true" >  
                <li><a href="#">Acura</a></li>  
                <li><a href="#">Audi</a></li>  
                <li><a href="#">BMW</a></li>  
                <li><a href="#">Cadillac</a></li>  
                <li><a href="#">Ferrari</a></li>  
            </ul>   
        　</div>  
    　</div>  
      
    </body>  
    </html>

![复制代码][copycode.gif]

4.在代码里访问页面

![ContractedBlock.gif][]

5.最后效果如下:

![300130282671479.jpg][]

加载webview不难，重点是js和java代码的交互，还有webview和httpclient之间的数据共享

参考:

如何整合前端代码和Android后端JAVA代码       [http://tech.it168.com/a2011/0517/1191/000001191561\_2.shtml][http_tech.it168.com_a2011_0517_1191_000001191561_2.shtml]

android webview里设置cookie  (webview的cookie和httpclient的cookie同步)     [http://blog.csdn.net/encienqi/article/details/7912733][http_blog.csdn.net_encienqi_article_details_7912733]

[http_www.cnblogs.com_sleeptothedeath_p_3700494.html]: http://www.cnblogs.com/sleeptothedeath/p/3700494.html
[300128541585496.jpg]: /images/20220731/5026b956f16f4865ba42c38b6b1cda24.png
[ExpandedBlockStart.gif]: /images/20220731/1aa31ebd8fbd4386a10c668593a9e222.png
[copycode.gif]: /images/20220731/2e6958f89b5e4ca7bdff9413306662b0.png
[ContractedBlock.gif]: /images/20220731/762dbf297756418f92c45b14a1214e8b.png
[300130282671479.jpg]: /images/20220731/edffedf852a14f419473bfc59aa34a32.png
[http_tech.it168.com_a2011_0517_1191_000001191561_2.shtml]: http://tech.it168.com/a2011/0517/1191/000001191561_2.shtml
[http_blog.csdn.net_encienqi_article_details_7912733]: http://blog.csdn.net/encienqi/article/details/7912733