Question

我的应用程序正在使用JSoup下载留言板页面的HTML（假设在这种情况下它是一个包含给定线程的帖子的页面）。我想使用此HTML，删除不需要的项目，并应用自定义CSS将其设置为在WebView中“移动”。

我应该在处理HTML时将样式注入到HTML中（因为我还是会处理它），或者有一种很好的方法可以将CSS文件添加到我应用的资源中并简单地引用它。我认为后者是理想的，但不确定如何去做。

我在WebView loadDataWithBaseURL中看到提示您可以引用本地资产，但不知道如何使用它。

Answer 1

htmlData = "<link rel=\"stylesheet\" type=\"text/css\" href=\"style.css\" />" + htmlData;
// lets assume we have /assets/style.css file
webView.loadDataWithBaseURL("file:///android_asset/", htmlData, "text/html", "UTF-8", null);

只有在此之后，WebView才能找到并使用资产目录中的css文件。

ps并且，是的，如果您从assets文件夹加载html文件，则无需指定基本URL。

Answer 2

我认为你的样式表“style.css”已经位于assets-folder

中

使用jsoup：

加载网页

doc = Jsoup.connect("http://....").get();

删除指向外部样式表的链接：

// remove links to external style-sheets
doc.head().getElementsByTag("link").remove();

设置本地样式表的链接：

// set link to local stylesheet
// <link rel="stylesheet" type="text/css" href="style.css" />
doc.head().appendElement("link").attr("rel", "stylesheet").attr("type", "text/css").attr("href", "style.css");

从jsoup-doc / web-page：
创建字符串
```
String htmldata = doc.outerHtml();
```

在webview中显示网页：

WebView webview = new WebView(this);
setContentView(webview);
webview.loadDataWithBaseURL("file:///android_asset/.", htmlData, "text/html", "UTF-8", null);

Answer 3

这是解决方案

将你的html和css放在你的/ assets /文件夹中，然后像这样加载html文件：

    WebView wv = new WebView(this);

    wv.loadUrl("file:///android_asset/yourHtml.html");

然后在你的HTML中你可以用通常的方式引用你的CSS

<link rel="stylesheet" type="text/css" href="main.css" />

Answer 4

如果您在内部文件存储中有CSS，则可以使用

//Get a reference to your webview
WebView web = (WebView)findViewById(R.id.webby);

// Prepare some html, it is formated with css loaded from the file style.css
String webContent = "<!DOCTYPE html><html><head><meta charset=\"UTF-8\"><link rel=\"stylesheet\" href=\"style.css\"></head>"
                      + "<body><div class=\"running\">I am a text rendered with INDIGO</div></body></html>";

//get and format the path pointing to the internal storage
String internalFilePath = "file://" + getFilesDir().getAbsolutePath() + "/";

//load the html with the baseURL, all files relative to the baseURL will be found 
web.loadDataWithBaseURL(internalFilePath, webContent, "text/html", "UTF-8", "");

Answer 5

是否可以在给定的div中将所有内容呈现在页面内？然后，您可以根据ID重置css，然后从那里开始工作。

说你给你的div id =“ocon”

在你的CSS中，有一个如下定义：

#ocon *{background:none;padding:0;etc,etc,}

您可以设置值以清除应用于内容的所有CSS。之后，您可以使用

#ocon ul{}

或其他任何内容，在样式表的下方，将新样式应用于内容。

Answer 6

您可以使用Online CSS链接设置现有内容的样式。

为此，您必须在webview中加载数据并启用JavaScript支持。

请参见以下代码：

   WebSettings webSettings=web_desc.getSettings();
    webSettings.setJavaScriptEnabled(true);
    webSettings.setDefaultTextEncodingName("utf-8");
    webSettings.setTextZoom(55);
    StringBuilder sb = new StringBuilder();
    sb.append("<HTML><HEAD><LINK href=\" http://yourStyleshitDomain.com/css/mbl-view-content.css\" type=\"text/css\" rel=\"stylesheet\"/></HEAD><body>");
    sb.append(currentHomeContent.getDescription());
    sb.append("</body></HTML>");
    currentWebView.loadDataWithBaseURL("file:///android_asset/", sb.toString(), "text/html", "utf-8", null);

在这里使用StringBuilder为样式附加字符串。

sb.append("<HTML><HEAD><LINK href=\" http://yourStyleshitDomain.com/css/mbl-view-content.css\" type=\"text/css\" rel=\"stylesheet\"/></HEAD><body>");
sb.append(currentHomeContent.getDescription());

使用自定义CSS在WebView中呈现HTML

6 个答案: