android&ios webView加载MarkDown 或者html代码片段

版权声明:本文为博主原创文章,转载希望能注明出处,感谢。 https://blog.csdn.net/u010126792/article/details/82460614

很多app详情页的新闻主体是html或者markdown片段,这里介绍一种简单的加载方式:

利用marked.js(https://github.com/chjj/marked)和webView就可以实现片段加载。

//bodyHtml 就是要加载的md或者html片段。
private String getHtmlData(String bodyHTML) {

        String head = "<!doctype html>\n" +
                "<html>\n" +
                "<head>\n" +
                "  <meta charset=\"utf-8\"/>\n" +
                "  <title>Marked in the browser</title>\n" +
                " <script type=\\\"text/javascript\\\" src = \\\"file:///android_asset/marked.js\\\" /></script>\n" +
                "</head>\n" +
                "<body>\n" +
                "  <div id=\"content\"></div>\n" +
                "  <script>\n" +
                "    document.getElementById('content').innerHTML =\n" +
                "      marked('";

        String other = "');\n" +
                "  </script>\n" +
                "</body>\n" +
                "</html>";

        //可以添加viewport 属性和展示图片的样式,也可以直接在代码片段中直接添加。
      /*  String head = "<head>" +
                "<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0, user-scalable=no\"> " +
                "<style>img{max-width: 100%; width:auto; height:auto;} div{width:100% }</style>" +
                "</head>";*/
        return  head + bodyHTML + other;
    }
//Android webView 加载方式
  webView.loadData(getHtmlData(getContent().toString().replaceAll("\r\n","<br>"), "text/html; charset=UTF-8", null);

猜你喜欢

转载自blog.csdn.net/u010126792/article/details/82460614