universal_html 2.0.4 
universal_html: ^2.0.4 copied to clipboard
dint.devA 'dart:html' that works in all platforms, including Flutter and server-side. Eases cross-platform development and HTML / XML processing.
Introduction #
A cross-platform dart:html:
- Eases cross-platform development
- You can use this package in browsers, mobile, desktop, and server-side VM, and server-side Javascript (Node.JS, Cloud Functions, etc.).
- Just replace
dart:htmlimports withpackage:universal_html/html.dart. Normal dart:html will continue to be used when application run in browsers.
- Extensive support for processing HTML and XML documents
- Parse, manipulate, and print DOM nodes.
- Find DOM nodes with querySelectorAll and other CSS query methods.
- Submit forms and more.
- EventSource streaming support
- Implements dart:html EventSource API.
The project is licensed under the Apache License 2.0. Some of the source code was adopted from the original dart:html, which is documented in the relevant files.
Documentation #
- API reference
- Github project
- We appreciate feedback, issue reports, and pull requests.
Similar projects #
- universal_io (cross-platform dart:io)
- jsdom (DOM implementation in Javascript)
Getting started #
1. Add dependency #
In pubspec.yaml:
dependencies:
universal_html: ^2.0.3
2. Use #
import "package:universal_html/html.dart";
void main() {
// Create a DOM tree
final div = DivElement();
div.append(Element.tag("h1")
..classes.add("greeting")
..appendText("Hello world!"));
// Print outer HTML
print(div.outerHtml);
// --> <div><h1>Hello world</h1></div>
// Do a CSS query
print(div.querySelector("div > .greeting").text);
// --> Hello world
}
Implemented APIs #
Summary #
- Document node classes
- DOM parsing
- Use element.innerHtml setter, DomParser, or package:universal_html/parsing.dart.
- HTML parsing uses package:html, CSS parsing uses package:csslib, and XML parsing uses our own parser.
- DOM printing
- Use element.innerHtml or element.outerHtml.
- DOM events
- For example, element.onClick.listen(...) receives invocation of element.click().
- CSS classes (CssStyleDeclaration, etc.)
- Most CSS queries
Examples #
Parsing HTML #
Use parseHtmlDocument:
import 'package:universal_html/parsing.dart';
void main() {
final htmlDocument = parseHtmlDocument('<html>...</html>');
}
Parsing XML #
Use parseXmlDocument:
import 'package:universal_html/parsing.dart';
void main() {
final xmlDocument = parseXmlDocument('<xml>...</xml>');
}
Scraping a website #
Load a Window with WindowController:
import 'package:universal_html/controller.dart';
Future main() async {
// Load a document.
final controller = WindowController();
await controller.openHttp(
uri: Uri.parse("https://news.ycombinator.com/"),
);
// Select the top story using a CSS query
final topStoryTitle = controller.document.querySelectorAll(".athing > .title").first.text;
// Print result
print("Top Hacker News story is: $topStoryTitle");
}
Metadata
476
likes
0
pub points
99%
popularity
Publisher
Metadata
A 'dart:html' that works in all platforms, including Flutter and server-side. Eases cross-platform development and HTML / XML processing.
Repository (GitHub)
View/report issues
License
unknown (license)
Dependencies
async, charcode, collection, csslib, html, meta, source_span, stream_channel, typed_data, universal_io
