如何使用 Jsoup 向 html 内容添加填充？

Question

我正在使用 Jsoup 库来解析 HTML 内容。我正在使用以下代码为我的代码标签添加样式。

                Document doc = Jsoup.parse(html_open);
            doc.append(content);
            doc.append(html_close);
            webView1.getSettings().setJavaScriptEnabled(true);
            webView1.setInitialScale(getScale());
            webView1.getSettings().setAllowFileAccess(true);
            webView1.getSettings().setLoadsImagesAutomatically(true);
            webView1.setWebViewClient(
                    new WebViewClient() {

                        @Override
                        public void onPageFinished(WebView view, String url) {
                            String javascriptCode = "javascript:";
                            javascriptCode+="var elements=document.querySelectorAll(\"code\");";
                            javascriptCode+="var parent;";
                            javascriptCode+="var container;";
                            javascriptCode+="for(i in elements){";
                            javascriptCode+="container = document.createElement('div');";
                            javascriptCode+="parent = elements[i].parentElement;";
                            javascriptCode+="parent.replaceChild(container, elements[i]);";
                            javascriptCode+="container.appendChild(elements[i]);";
                            javascriptCode+="container.setAttribute(\"style\",\" white-space: nowrap; background-color: #EEEEEE;  padding-top: 4px;  padding-right: 4px;  padding-bottom: 4px;  padding-left: 4px;\");}";
                            webView1.loadUrl(javascriptCode);
                        }
                    }
            );
            webView1.loadDataWithBaseURL("", String.valueOf(doc), "text/html", "UTF-8", "");

这是我要解析的 html 代码。

<h2>Checking Data Features</h2>
<h3>Get the names of the columns of an object</h3>
<p><code><strong>names</strong>(salary_data)</code></p>
<p><code>&gt; names(salary_data)</code> <code>[1] "First_Name" "Last_Name" "Grade" <br />[4] "Location" "ba" "ms"</code></p>
<h3>Compactly display the internal structure of an R Object</h3>
<p><code><strong>str</strong>(salary_data)</code></p>
<p><code>&gt; <strong>str</strong>(salary_data)</code></p>
<p><code>'data.frame': 12 obs. of 6 variables:</code></p>
<p><code>&nbsp;$ First_Name: Factor w/ 12 levels "Aaron","Adela",..: 4 3 10 5 9 11 1 8 12 7 ... <br />&nbsp;$ Last_Name : Factor w/ 12 levels "Brown","Chavan",..: 1 12 5 6 8 2 3 7 4 10 ... <br />&nbsp;$ Grade : Factor w/ 2 levels "GR1","GR2": 1 2 1 2 1 2 1 2 1 2 ... <br />&nbsp;$ Location : Factor w/ 2 levels "DELHI","MUMBAI": 1 2 2 1 2 2 2 2 1 1 ... <br />&nbsp;$ ba : int 17990 12390 19250 14780 19235 13390 23280 13500 20660 13760 ... <br />&nbsp;$ ms : int 16070 6630 14960 9300 15200 6700 13490 10760 NA 13220 ...</code></p>
<p>Structure gives the following information:</p>
<ul>
<li>Type of the variable.</li>
<li>Number of levels of each factor.</li>
<li>Some values of the first few rows</li>
</ul>

我正在尝试为 html 中的代码标签添加边框、背景颜色和填充。但是这段代码没有将所需的样式添加到我的 html content.I 正在 android web view.Is 中显示此内容有一种方法可以将所有代码标记添加到 div 然后设置 div.

的样式

我的输出看起来像：-

任何帮助或建议都是 appreciated.Thank 你。

Answer 1

您可以使用 javascript 设置样式。在webView1.loadDataWithBaseURL(...)

前添加如下代码

webView1.setWebViewClient(
    new WebViewClient() {

        @Override
        public void onPageFinished(WebView view, String url) {
            String javascriptCode = "javascript:";
            javascriptCode+="var elements=document.querySelectorAll(\"code\");";
            javascriptCode+="var parent;";
            javascriptCode+="var container;";
            javascriptCode+="for(i in elements){";
            javascriptCode+="container = document.createElement('div');";
            javascriptCode+="parent = elements[i].parentElement;";
            javascriptCode+="parent.replaceChild(container, elements[i]);";
            javascriptCode+="container.appendChild(elements[i]);";
            javascriptCode+="container.setAttribute(\"style\",\"overflow:scroll; border: 1px solid black; background-color: #EEEEEE;  padding-top: 50px;  padding-right: 30px;  padding-bottom: 50px;  padding-left: 80px;\");}";
            webView1.loadUrl(javascriptCode);
        }
    }
);

如何使用 Jsoup 向 html 内容添加填充？

How to add padding to html content using Jsoup?

html

css

android

android-webview

jsoup