如何在通用 Windows 应用程序的 WebView 中调用 javascript 函数

Question

我是通用应用程序开发的新手。谁能帮我输入以下代码，

我在通用应用程序中使用 Web 视图控件加载了一个网站。我想从同一个网站读取一些控制值。

我的标签控件 ID 在网站上是“lblDestination”。

我正在通用应用程序中访问它，例如 MAinPage.xaml

<WebView x:Name="Browser"  HorizontalAlignment="Stretch"
                 VerticalAlignment="Stretch"
                 Loaded="Browser_Loaded"
                 NavigationFailed="Browser_NavigationFailed">
</WebView>

MAinPage.xaml.cs

Browser.InvokeScript("eval", new string[] { "document.getElementById('lblDestination')" }).ToString()

这是读取浏览器控件值的正确方法吗？ 我正在使用模拟器来测试这个应用程序，那么是模拟器造成了问题吗？

Answer 1

我不确定您在何时何地使用 InvokeScript 和 JavaScript eval 函数将内容注入网页。但通常我们可以使用WebView.DOMContentLoaded event。当 WebView 完成对当前 HTML 内容的解析时会发生此事件，因此通过此事件我们可以确保 HTML 内容已准备好。

如果我们想在 Windows 10 通用应用的 WebView 内容中调用 JavaScript，我们最好使用 WebView.InvokeScriptAsync method as

[InvokeScript 可能会更改或无法用于 Windows 8.1 之后的版本。相反，请使用InvokeScriptAsync。]

最后但同样重要的是，请注意InvokeScriptAsync 方法只能返回脚本调用的字符串结果。

调用的脚本只能返回字符串值。

所以如果你的 JavaScript 的返回值不是字符串，WebView.InvokeScriptAsync 方法的返回值将是一个空字符串。

如果你使用

var value = await Browser.InvokeScriptAsync("eval", new string[] { "document.getElementById('lblDestination')" });

该值将是一个空字符串，因为document.getElementById('lblDestination') 返回一个Element。

所以要读取一些控制值，您可以尝试使用如下代码：

var innerText = await Browser.InvokeScriptAsync("eval", new string[] { "document.getElementById('lblDestination').innerText" });

如果你要获取的值不是字符串，你可能需要先在 JavaScript 中将其转换为字符串。例如：

var childElementCount = await Browser.InvokeScriptAsync("eval", new string[] { "document.getElementById('lblDestination').childElementCount.toString()" });