zoukankan      html  css  js  c++  java
  • 02、获取 WebView 控件中,加载的 HTML 网页内容


         在开发 app 的时候,WebView 是经常使用的控件。而且有时需要向 WebView 中的 html 内容

    注入额外的 js 进行操作。这里记录一下在当前 WebView 控件中,获取 html 内容的方法。

    运行效果:

    1、首先在工程根目录下面放一个 test.html 文件,里面放入一些 html,作为测试内容: 

    <!DOCTYPE html>
    
    <html lang="en" xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta charset="utf-8" />
        <title></title>
    </head>
    <body>
        <!--绿色背景、居中-->
        <div style="400px;height:100px;color:black;background:#0f0;margin:0px auto;font-size:40px;">
            测试内容
        </div>
    </body>
    </html>

    放在根目录下:

     2、在页面上放置一个 WebView 用来显示网页内容,另外放置两个按钮:

    <Grid Background="White">
        <Grid.RowDefinitions>
            <RowDefinition Height="100"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
        <StackPanel HorizontalAlignment="Center" Orientation="Horizontal">
            <Button Content="方法 一" Click="Button_f1_Click"/>
            <Button Content="方法 二" Click="Button_f2_Click"/>
        </StackPanel> 
    <WebView x:Name="webView" Grid.Row="2" Source="test.html"/>
    </Grid>

     3、在 C# 页面:

     public MainPage()
     {
         this.InitializeComponent();
    
         this.Loaded += MainPage_Loaded;
         
         webView.ScriptNotify += webView_ScriptNotify;
     }
    
     // 把 appx 根目录下的 test.html 网页内容加载到 WebView 中
     async void MainPage_Loaded(object sender, RoutedEventArgs e)
     {
         string html = "";
         StorageFile file = await Windows.ApplicationModel.Package.Current.InstalledLocation.GetFileAsync("test.html");
    
         using (StreamReader sr = new StreamReader(await file.OpenStreamForReadAsync()))
         {
             html = sr.ReadToEnd();
         }
    
         // 如果网页内容是从网络下载的,则可以把 getHTML() 方法 注入到 html 中
         html += "<script>function getHTML(){ window.external.notify(document.documentElement.innerHTML)}</script>";
    
         webView.NavigateToString(html);
     }
    
     // 方法 一:调用注入的 js 方法
     async void Button_f1_Click(object sender, RoutedEventArgs e)
     {
        await webView.InvokeScriptAsync("getHTML", null);
         
     }
    
     void webView_ScriptNotify(object sender, NotifyEventArgs e)
     {
         // e.Value 中为方法调用的返回值
         Debug.WriteLine(e.Value);
     }
    
    
     // 方法 二:直接通过 html 中 window 对象的 eval 方法,将当前网页内容返回
     async void Button_f2_Click(object sender, RoutedEventArgs e)
     {
         // 直接将结果返回(返回值为 WebView 中的 html),并不会出发 ScriptNotify 事件
         var html = await webView.InvokeScriptAsync("eval", new[] { "document.documentElement.innerHTML" });
    
         Debug.WriteLine(html);
     }
  • 相关阅读:
    计算机原理 3.4 补码一位乘法
    信号与系统 第二章(2.1)
    信号与系统(1.6、1.7)
    第17章 使用BIOS进行键盘输入和磁盘读写
    第16章 直接定址表
    聚类:主要聚类算法
    机器学习——输入空间、特征空间、输出空间
    机器学习——线性回归
    机器学习——梯度下降法
    深度学习——概率与信息论
  • 原文地址:https://www.cnblogs.com/hebeiDGL/p/4399111.html
Copyright © 2011-2022 走看看