Добавить пользовательский CSS в HTML-код с помощью jsoup - PullRequest
Новая
       7

Добавить пользовательский CSS в HTML-код с помощью jsoup

10 голосов
/ 11 апреля 2011

Я работаю над приложением для Android, которое загружает HTML-страницу и показывает ее в веб-просмотре.Проблема в том, что я хочу добавить свой собственный CSS (загруженный HTML не имеет CSS или ссылки на CSS).Как добавить пользовательский CSS в код HTML с помощью jsoup?Я не могу изменить HTML.И как веб-просмотр может открыть его потом?Спасибо

Ответы [ 3 ]

21 голосов
/ 11 апреля 2011

Несколько способов. Вы можете использовать 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;");

В любом случае, после модификации получите окончательную строку HTML на Document#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();

Наконец, откройте его в веб-представлении. Так как я не могу сказать это с головы до головы, вот только ссылка с примером, который я считаю полезным: WebViewDemo.java . Кстати, я нашел ссылку в этом блоге (которую я, в свою очередь, нашел в Google).

3 голосов
/ 11 апреля 2011

Вероятно, самый простой способ - найти и заменить текст HTML, чтобы вставить ваши пользовательские стили, прежде чем загружать его в WebView. Я делаю это в своем приложении BBC News, чтобы немного изменить стиль страницы новостной статьи. Мой код выглядит так: 

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> в замененном сегменте. Это гарантирует, что новый фрагмент будет отображаться в нужном темпе на странице.

1 голос
/ 11 апреля 2011

Есть несколько способов включить ccs в html

Это можно использовать, если он хранится как внешний файл: 

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

Если вы хотите поместить его в HTMLfile: 

<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>

* Edit

Любой из этих примеров не долженУ него нет проблем с отображением.

Ссылка: W3 Schools CSS

...