我如何在Flutter WebView中注入简单的代码以隐藏网站的一部分（页脚）？

Question

您好，我是Flutter的新手，目前，我正在制作一个非常简单的应用程序，只是一个WebView。我的问题是如何将这段代码插入Flutter Webview？

footer#footer, div#st_notification_1, #sidebar_box {
    display: none!important;
}

目前，我正尝试在我的应用程序选项卡之一上使用Flutter Team的WebView插件。该网站正在尝试加载和隐藏页脚的网站是：syncshop.online/en /

下面是我在该标签上的代码

import 'dart:async';
import 'package:flutter/material.dart';
import 'package:webview_flutter/webview_flutter.dart';

class HomePage extends StatefulWidget {
  HomePage({Key key}) : super(key: key);

  @override
  _HomePageState createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  WebViewController _myController;
      final Completer<WebViewController> _controller =
      Completer<WebViewController>();
  @override
  Widget build(BuildContext context) {
    return SafeArea(
          child: Scaffold(
            body: WebView(
              initialUrl: 'https://syncshop.online/en/',
              javascriptMode: JavascriptMode.unrestricted,
              onWebViewCreated: (WebViewController webViewController) {
                _controller.complete(webViewController);
          },
          onPageFinished: (initialUrl) {
            _myController.evaluateJavascript("document.getElementsById('footer')[0].style.display='none';");
          },
        ),
      ),
    );
  }
}

这是到目前为止，在查看网站的检查元素时，即使我放置了footer ID，它仍然没有隐藏

Answer 1

您可以尝试

flutterWebviewPlugin.evalJavascript('alert("Hello World")')

[请记住，evalJavascript()取代了JS而不是HTML，所以您不能像这样使用

flutterWebviewPlugin.evalJavascript('<script language="JavaScript" type="text/javascript">alert("Hello World")</script>')