修改Webview控件中的传输数据

Question

我想将内容注入我从WebView Control调用的网页，而html代码是：

<section id="header" class="header-section section-padding">
    <div class="container">
        <div class="row">
            <div class="text-center">
                <h2 class="section-title">Text I Want to Change</h2>
            </div>
        </div>
    </div>
</section>

我是从this tutorial尝试过的：

string functionString = String.Format("document.getElementById('header').getElementsByTagName('h2')[0].innerHTML = 'new text';");
await webView1.InvokeScriptAsync("eval", new string[] { functionString });

但是这会产生错误。我在javascript中不是很好，所以如何更改h2标记内的文字？

Xaml代码：

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
    <WebView x:Name="WebView"
             LoadCompleted="WebView_LoadCompleted"
             Source="http://info.vit.ac.in/gravitas2015/tg15/index.html" />
    <ProgressRing x:Name="ProgressRing"
                  Width="100"
                  Height="100"
                  Foreground="BlueViolet"
                  IsActive="True" />
</Grid>

Cs代码：

private  async void WebView_LoadCompleted(object sender, NavigationEventArgs e)
{      
    string functionString = String.Format("document.getElementById('header').getElementsByTagName('h2')[0].innerHTML = 'new text';");
    await WebView.InvokeScriptAsync("eval", new string[] { functionString });
    ProgressRing.Visibility = Visibility.Collapsed;   
}

我得到的错误：

System.Exception was unhandled by user code
HResult=-2147352319
Message=Exception from HRESULT: 0x80020101
Source=mscorlib
StackTrace:
     at System.Runtime.CompilerServices.TaskAwaiter.ThrowForNonSuccess(Task task)
     at System.Runtime.CompilerServices.TaskAwaiter.HandleNonSuccessAndDebuggerNotification(Task task)
     at System.Runtime.CompilerServices.TaskAwaiter`1.GetResult()
     at WindowsApp2.Views.Organisers.<WebView_LoadCompleted>d__1.MoveNext()
InnerException: 

要重现此问题：

1. 创建Template10汉堡包模板
2. 添加一个新的xaml页面说team.xaml并将此页面添加到hamburger shell（一个新的汉堡包按钮以导航到此页面）
3. 在team.xaml中复制我的代码。
4. 现在运行它并从汉堡菜单导航到此页面。
5. 这将产生上述错误。

提前致谢！

Answer 1

此处的问题是，您的html页面中没有section id为“标题”：http://info.vit.ac.in/gravitas2015/tg15/index.html。

如果我们在网络浏览器中测试JavaScript代码（例如Edge），我们会发现它会抛出如下错误：

这就是我们在代码隐藏中调用InvokeScriptAsync时遇到异常的原因。我不确定您要更改哪个section，但如果您编辑如下所示的JavaScript字符串，则您的代码应该可以正常工作。

string functionString = String.Format("document.getElementById('portfolio').getElementsByTagName('h2')[0].innerHTML = 'new text';");

除此之外，在Windows 8.1之后，WebView.LoadCompleted event可能会被更改或不可用于发布。相反，请使用NavigationCompleted。