在开发 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="width: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);
}

02、获取 WebView 控件中,加载的 HTML 网页内容的更多相关文章

  1. 【高德地图API】Pivot控件中加载地图并禁止Pivot手势

    如题,解决方案,参考[Windows phone应用开发[20]-禁止Pivot手势]http://www.cnblogs.com/chenkai/p/3408658.html. xaml代码清单   ...

  2. 重新想象 Windows 8.1 Store Apps (81) - 控件增强: 加载本地 html, 智能替换 html 中的 url 引用, 通过 Share Contract 分享 WebView 中的内容, 为 WebView 截图

    原文:重新想象 Windows 8.1 Store Apps (81) - 控件增强: 加载本地 html, 智能替换 html 中的 url 引用, 通过 Share Contract 分享 Web ...

  3. easyui控件的加载顺序

    使用easyui做布局时,会模仿窗口程序界面,做出一些较复杂的布局.按由外层到内层的顺序: (最外层)panel->tabs->tabs1 ->tabs2->layout-&g ...

  4. 使用DevExpress.XtraTabbedMdi.XtraTabbedMdiManager控件来加载MDI窗体

    使用DevExpress.XtraTabbedMdi.XtraTabbedMdiManager控件来加载MDI窗体     [csharp] view plaincopyprint? <SPAN ...

  5. .net获取select控件中的文本内容

    .net获取select控件中的文本内容 2009-11-28 21:19小V古 | 分类:C#/.NET | 浏览1374次 <select id="SecType" st ...

  6. GridView控件中加自动排列序号

    GridView控件中加自动排列序号 为 Gridview 增加一个新的空白列,如下: <asp:BoundField  HeaderText="序号">    < ...

  7. Delphi7 第三方控件1stClass4000的TfcImageBtn按钮控件动态加载jpg图片例子

    Delphi7 第三方控件1stClass4000的TfcImageBtn按钮控件动态加载jpg图片例子 procedure TForm1.Button1Click(Sender: TObject); ...

  8. WPF中获取TreeView以及ListView获取其本身滚动条的方法,可实现自行调节scoll滚动的位置(可相应获取任何控件中的内部滚动条)

    原文:WPF中获取TreeView以及ListView获取其本身滚动条的方法,可实现自行调节scoll滚动的位置(可相应获取任何控件中的内部滚动条) 对于TreeView而言: TreeViewAut ...

  9. 在WinForm应用程序中,使用选项卡控件来加载不同的Form界面!

    TabPage tp=new TabPage(); your选项卡控件.Controls.Add(tp); From1 frm=new Form1(); frm.TopLevel = false; f ...

随机推荐

  1. 初见-TensorRT简介<转>

    下面是TensorRT的介绍,也可以参考官方文档,更权威一些:https://developer.nvidia.com/tensorrt 关于TensorRT首先要清楚以下几点: 1. TensorR ...

  2. python with和上下文管理工具

    对于系统资源如文件.数据库连接.socket 而言,应用程序打开这些资源并执行完业务逻辑之后,必须做的一件事就是要关闭(断开)该资源. 比如 Python 程序打开一个文件,往文件中写内容,写完之后, ...

  3. 如何设置ESXi中的虚拟机随主机一同启动?

    笔者新装了几台ESXi的主机, 其中一台上面运行着一台安装了vCenter的虚拟机.  笔者一路默认, 也没改什么设置. 在试图解决其他问题的过程中, 笔者重启了ESXi. 后来发现vCente登不进 ...

  4. 数值格式化 NumberFormat DecimalFormat RoundingMode

    NumberFormat [简介] java.text.NumberFormat extends java.text.Format extends java.lang.Object 实现的接口:Ser ...

  5. 【ichartjs】用ichartjs替代Excel做直方图

    在 http://www.cnblogs.com/xiandedanteng/p/8717506.html 一文中,最后是用Excel作图,现在用ichartjs替代之. 效果如下: 文件下载: ht ...

  6. hdu 5247 找连续数(思维)

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=5247 找连续数 Time Limit: 2000/1000 MS (Java/Others)    M ...

  7. 0x8002801D:库没有注册

    同一段代码,在测试机上运行成功,但在用户机上运行失败,并报错:无法将类型为GeoProcessorClass的COM对象强制转换为接口类型IGeoProcessor,此操作失败的原因是COM组件调用Q ...

  8. C++ 11 - STL - 函数对象(Function Object) (上)

    1. 定义 在STL中,可以把函数传递给算法,也可以把函数对象传递给算法. 那么,什么是函数对象呢? 我们来看下它的声明: class X { public: // define function c ...

  9. nested exception is java.lang.IllegalStateException: Cannot forward after response has been committed

    org.springframework.web.util.NestedServletException: Request processing failed; nested exception is ...

  10. 深入探讨Linux静态库与动态库的详解(转)

    2.生成动态库并使用 linux下编译时通过 -shared 参数可以生成动态库(.so)文件,如下 库从本质上来说是一种可执行代码的二进制格式,可以被载入内存中执行.库分静态库和动态库两种. 一.静 ...