javascript - 如何在 Flutter webview 中操作 HTML？

Question

我正在使用 Flutter webview 加载网站。但我想在加载时替换 HTML 元素。例如:

<span class="name">Replace text</span>

怎么办？

Answer 1

因此，这取决于您使用什么库来加载您的 webview。

我使用 webview_flutter_plus ( https://pub.dev/packages/webview_flutter_plus ) 取得了一些成功。

有了这个，你只需要等待你的 html 加载并注入(inject)一些 javascript 来修改你想要的任何 html。

像这样:

Widget build(BuildContext context) {
    return WebViewPlus(
        initialUrl: myUrl,
        javascriptMode: JavascriptMode.unrestricted,
        onWebViewCreated: (WebViewPlusController webViewController) {
            _webViewController = webViewController;
        },
        onPageFinished: (String url) {
            _webViewController.evaluateJavascript('document.querySelector(".name").innerHTML = "new text";');
        }
   }
}