71
loading...
How can we parse HTML tags in Flutter
What we will cover in this post is
Read Html file from url
Parse html tags
Display updated html text on screen
Parse Html Data
Now we have html data which are fetched from url by using http package. Its time to parse that fetched content. By using below code we have parsed the html tags
For example in the tutorial page we have index of the chapters. Now we need to fetch all index title and href tag url
The Index div contains class name as chapters, so we will read all index data by parsing like below
var chapters = document.getElementsByClassName("chapters");
chapters.forEach((element) {
var inner = element.innerHtml.toString();
if (inner.contains("href")) {
parse(inner).getElementsByTagName("li").forEach((element) {
var list = element.innerHtml;
if (list.contains("href")) {
// indexlist_local.add(list.substring(list.indexOf("href=")+6,list.indexOf(">")-1));
indexlist_local.add(IndexContent(title: element.text,
path: list.substring(
list.indexOf("href=") + 6, list.indexOf(">") - 1)));
}
});
}
});Render Edited Html data on the screen
We have all edited html text, now we will show all index data in listview and its chapter content onscreen. Read How to load Html data in flutter using html_flutter plugin to load html data .
See Full source code for Parse HTML in Flutter
71