目录介绍 1.WebView和Js交互方式 2.Android调用JS脚本 3.JS调用Android方法 4.Android 调用HTML中的javascript脚本并传递参数 5.HTML中的javascript脚本调用Android本地代码并传递参数 6.案例：H5页面点击图片监听图片链接地址
1.WebView和Js交互的几种方式
Android去调用JS的代码 JS去调用Android的代码对于android调用JS代码的方法有2种：
1. 通过WebView的loadUrl（） 2. 通过WebView的evaluateJavascript（）对于JS调用Android代码的方法有3种：
1. 通过WebView的addJavascriptInterface（）进行对象映射 2. 通过 WebViewClient 的shouldOverrideUrlLoading ()方法回调拦截 url 3. 通过 WebChromeClient 的onJsAlert()、onJsConfirm()、onJsPrompt（）方法回调拦截JS对话框alert()、confirm()、prompt()消息2. Android调用JS脚本 对于Android调用JS代码的方法有2种：
- 通过WebView的loadUrl（） - 通过WebView的evaluateJavascript（） **通过WebView的evaluateJavascript()** 优点：该方法比第一种方法效率更高、使用更简洁。 1. 因为该方法的执行不会使页面刷新，而第一种方法（loadUrl ）的执行则会。 2. Android 4.4 后才可使用 //只需要将第一种方法的loadUrl()换成下面该方法即可 mWebView.evaluateJavascript（"javascript:callJS()", new ValueCallback<String>() { @Override public void onReceiveValue(String value) { //此处为 js 返回的结果 } }); **通过WebView的loadUrl()** 直接Webview调用loadUrl方法，里面是JS的方法名，并可以传入参数，javascript：xxx()方法名需要和JS方法名相同 contentWebView.loadUrl("javascript:javacalljs()");HTML代码
使用建议
两种方法混合使用，即Android 4.4以下使用方法1，Android 4.4以上方法2 //Android版本变量 final int version = Build.VERSION.SDK_INT; //因为该方法在 Android 4.4 版本才可使用，所以使用时需进行版本判断 if (version < 18) { mWebView.loadUrl("javascript:callJS()"); } else { mWebView.evaluateJavascript（"javascript:callJS()", new ValueCallback<String>() { @Override public void onReceiveValue(String value) { //此处为 js 返回的结果 } }); }3. JS调用Android方法 在Java代码中添加下面这句，webview绑定javascriptInterface，js脚本通过这个接口来调用java代码， 第一个参数是自定义类对象，映射成JS对象，这里我直接传this，第二个参数是别名，JS脚本通过这个别名来调用java的方法，这个别名跟HTML代码中也是对应的。
contentWebView.addJavascriptInterface(MainActivity.this,"android");HTML代码
4.Android 调用HTML中的javascript脚本并传递参数
WebView.loadUrl("javascript:javacalljswith(" + "'http://blog.csdn.net/Leejizhou'" + ")");HTML代码
5. HTML中的javascript脚本调用Android本地代码并传递参数
Android Java代码 @JavascriptInterface public void startFunction(final String text){ runOnUiThread(new Runnable() { @Override public void run() { new AlertDialog.Builder(WebViewFiftyActivity.this).setMessage(text).show(); } }); } HTML代码 function javacalljswith(arg){ document.getElementById("content").innerHTML = ("<br\>"+arg); }6.案例：H5页面点击图片监听图片链接地址
settings.setJavaScriptEnabled(true); wv_view.addJavascriptInterface(new ImageJs(this),"imageListener"); /**打开图片js通信接口*/ private class ImageJs { private final Activity activity; public ImageJs(Activity activity) { this.activity = activity; } // 下面的@SuppressLint("JavascriptInterface")最好加上。防止在某些版本中js和java的交互不支持。 //@SuppressLint("JavascriptInterface") @android.webkit.JavascriptInterface public void openImage(String img) { Log.i("url地址","图片"+ img); **//跳转页面** } } /**添加图片点击事件的js代码，网上找到，就是这样写，不需要明白*/ private void addImageClickListner() { String jsCode="javascript:(function(){" + "var imgs=document.getElementsByTagName(\"img\");" + "for(var i=0;i<imgs.length;i++){" + "imgs[i].onclick=function(){" + "window.imageListener.openImage(this.src);" + //imageListener自定义，openImage要与js通信接口相同 "}}})()"; wv_view.loadUrl(jsCode); }后续： 知乎：https://www.zhihu.com/people/yang-chong-69-24/pins/posts 领英：https://www.linkedin.com/in/chong-yang-049216146/ 简书：http://www.jianshu.com/u/b7b2c6ed9284 csdn：http://my.csdn.net/m0_37700275 网易博客：http://yangchong211.blog.163.com/ 新浪博客：http://blog.sina.com.cn/786041010yc github：https://github.com/yangchong211 喜马拉雅听书：http://www.ximalaya.com/zhubo/71989305/
