访问 WebBrowser 中的 js 变量和 JSON 数据 IEBrowser [2]

之前 5 月份写了一篇关于 IEBrowser 的文章, 讲解了 IEBrowser 如何在 WebBrowser 中执行 js 脚本和 jQuery 脚本, 今天准备给大家讲解一下如何获取设置 WebBrowser 中的变量或者 JSON 数据.

这里说变量和 JSON 数据, 其实还是只有变量一种, 只是在 IEBrowser 中将这些变量分为简单和复杂的两种, 简单的变量可以是数字或者字符串等, 复杂的数据可以是对象或者数组.

我们现看下面的一段代码:

IEBrowser ie = new IEBrowser ( this.webBrowser );

ie.InstallScript ( "function showInfo(){if(age <= 10){age += 10;}document.body.innerHTML += '年龄:' + age + ', 姓名:' + name;}" );

ie.InstallTrace ( );

ie.__Set ( "name", "'小明'" );
ie.__Set ( "age", "10" );

ie.InvokeScript ( "showInfo" );

this.lblResult.Text = string.Format ( "age = {0}", ie.__Get<int> ( "age" ) );

这一段代码, 使用 IEBrowser 的 InstallScript 安装了一个 js 函数 showInfo, 在这个函数中, 我们判断了变量 age 是否小于等于 10, 如果是则 age 加 10, 然后将 name 和 age 显示在页面中.

由于函数中并没有声明变量 name 和 age 的语句, 所以调用 showInfo 函数的话, age 和 name 都是 undefined, 因此在面的语句中, 我们使用 IEBrowser 的 __Set 方法来设置这两个变量, 分别设置了 name 变量为字符串 '小明', age 变量为 10. 在调用 __Set 或者 __Get 方法前, 需要调用 InstallTrace 方法.

之后, 我们使用 IEBrowser 的 InvokeScript 方法调用之前定义的 js 函数 showInfo, 页面上会显示小明 10 岁的信息. 在 showInfo 执行时, 由于 age 为 10, 所以最终 age 自加 10 后为 20. 我们通过 __Get 方法获取修改后的 age 变量, 并显示在窗口的标签中.

上面的代码演示了如何获取设置简单的变量, 下面的代码说明了如何获取设置 JSON 数据:

IEBrowser ie = new IEBrowser ( this.webBrowser );

ie.ExecuteScript ( "var student = {name: '小刚', age: 10, scores: [100,90,80]}" );

ie.InstallTrace ( );

JSON student = ie.__GetJSON ( "student" );

student.Attributes["name"].Value = "小小";
student.Attributes["scores"].Values[0].Value = 99;

ie.__SetJSON ( "student", student );

JSON student2 = ie.__GetJSON ( "student" );

this.lblResult.Text = string.Format ( "{0},{1},{2},{3},{4}", student2.Attributes["name"].Value, student2.Attributes["age"].Value, student2.Attributes["scores"].Values[0].Value, student2.Attributes["scores"].Values[1].Value, student2.Attributes["scores"].Values[2].Value );

在这段代码中, 首先在页面中定义了一个名称为 student 的 JSON 变量. student 拥有 name, age, scores 三个字段. 然后, 通过 IEBrowser 的 __GetJSON 方法获得了 student 的变量返回一个 JSON 类型的对象. 这个 .NET 中的 JSON 对象和页面中的 JSON 对象对应.

我们可以使用 JSON 对象的 Attributes 属性来访问 JSON 的属性, 通过 Values 属性来访问 JSON 数组中的值, 通过 Value 来直接访问值. 代码中, 我们修改了 JSON 对象的姓名和第一个成绩.

之后, 我们使用 __SetJSON 将修改过的 JSON 写回到页面的 JSON 变量中, 为了验证是否修改成功, 我们重新将页面中的 JSON 数据取回到 .NET 的 JSON 对象中, 并将信息显示在窗口上.

这样已经演示了使用 IEBrowser 控制 WebBrowser 与程序进行简单和复杂的数据交互.

IEBrowser 是开源共享的代码, 可以在 http://code.google.com/p/zsharedcode/wiki/Download 页面下载 dll 或者是源代码.

如果大家希望看到实际的效果或者还不是很明白可以参考视频讲解: http://www.tudou.com/programs/view/E8-79ot9JTA/.