使用jsoup将自定义CSS添加到HTML代码

Question

使用jsoup将自定义CSS添加到HTML代码

13

我正在开发一款Android应用程序，该应用程序加载HTML页面并在Webview中显示该页面。问题是我想添加自定义CSS样式表（加载的HTML没有任何CSS或链接到CSS）。如何使用jsoup向HTML代码添加自定义CSS？而我又不能修改HTML代码。那么Webview如何在之后打开它呢？谢谢。

- PixelPW

这不是同样的问题。我无法使用loadDataWithBaseURL加载它，因为HTML中没有任何链接到ccs。因此，我无法在本地应用程序中引用css。 - PixelPW

3个回答

4

可能最简单的方法是在将HTML文本加载到您的WebView之前，在HTML文本上进行搜索和替换以插入您的自定义样式。我在我的BBC新闻应用程序中这样做，稍微重新设计了新闻文章页面。我的代码如下：

text = text.replace("</head>",
        "<style>h1 {font-size: x-large;} h1, div.date, div.storybody, img {margin:4px; padding:4px; line-height:1.25;}</style></head>");

看我如何在结尾的 head 标签上进行搜索和替换（包括我的自己的 </head> 标签在被替换的部分中）。这确保了新片段放置在页面的正确位置。

- Jim Blackler

1

在HTML中包含CSS有几种方法

如果你将CSS存储为外部文件，可以使用以下方法：

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

如果您想直接将其放到HTML文件中：

<head>
<style type="text/css">
hr {color:sienna;}
p {margin-left:20px;}
body {background-image:url("images/back40.gif");}
</style>
</head>

或者如果你想修改单个标签：

<p style="color:sienna;margin-left:20px">This is a paragraph.</p>

*编辑

这些示例任何一个都不应该出现显示问题。

参考：W3 Schools CSS

- KilledKenny

问题在于我从网页加载HTML表单，所以无法更改HTML。我想使用jsoup添加代码，然后加载自己的CSS。 - PixelPW

1

我明白了，你的问题有些误导性，听起来好像你对HTML有控制权。我编辑了问题，指引其他人正确方向。我自己没有使用jsoup的经验。 - KilledKenny

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- BalusC · Accepted Answer

有几种方法。你可以使用 Element＃append（） 将一些HTML代码附加到该元素。

Document document = Jsoup.connect(url).get();
Element head = document.head();
head.append("<link rel=\"stylesheet\" href=\"http://example.com/your.css\">");

或者，使用Element#attr(name, value)来向现有元素添加属性。这是一个示例，将style="color:pink;"添加到所有链接中。

Document document = Jsoup.connect(url).get();
Elements links = document.select("a");
links.attr("style", "color:pink;");

无论如何，修改后通过Document#html()获取最终的HTML字符串。

String html = document.html();

使用正确的字符集，通过PrintWriter#write()将其写入文件。

String charset = Jsoup.connect(url).response().charset();
// ...
Writer writer = new PrintWriter("/file.html", charset);
writer.write(html);
writer.close();

最后在webview中打开它。因为我无法马上告诉你该怎么做，所以这里只有一个链接，链接里面有一个我认为很有帮助的示例：WebViewDemo.java。顺便说一下，我是通过谷歌搜索找到了这篇博客，而在博客里找到了那个链接。