Silverlight之Silverlight和HTML(DOM,JS)交互 (转载)

Silverlight虽然是以插件形式来显示的，但是它和JS以及HTML的交互还是很方便的，下面一一道来

Silverlight得到浏览器的信息：

Name，得到浏览器名称

BrowserVersion得到浏览器版本

Platform，得到运行平台信息

CookiesEnabled,得到一个值标识是否启用Cookie

UserAgent得到当前代理信息

打开一个窗口，效果等同于window.open:

HtmlPage.PopupWindow，打开一个窗口，可以指定HtmlPopupWindowOptions参数，

<a href="http://www.cnblogs.com/ListenFly/archive/2011/12/07/2269532.html"></a>

HtmlPopupWindowOptions 可以指定页面的属性，高度、宽度地址栏之类的属性，其实PopupWindow的原理就是调用了js的Window.Open方法.

切记，PopopWindow只能在事件(触发)中起作用，也就意味着不能一开始就显示,另外其中的Url必须是绝对路径。

HtmlDocument,表示一个完整的 Html的 Document对象，可以使用HtmlPage.Document得到

主要属性：

DocumentUri：得到当前页面的URL地址

QueryString：得到传递的参数

DocumentElement:得到HtmlDocument对象

Body:得到Body节点(HtmlElement类型)

Cookies:Cookie的支持，很有用

CreateElement():创建一个HtmlElement节点(一个Html的标签元素)

AttachEvent():给Html元素附加脚本事件

DetachEvent():删除脚本事件

Submit():提交页面，如果Silverlight在aspx页面很有用，可以执行服务器代码

操作HtmlElement：

AppendChild()：追加HtmlElement对象

RemoveChild()：移除HtmlElement

Focus()：使HtmlElement元素获得焦点

GetAttribute(),

SetAttribute(), and

RemoveAttribute()： 得到或者设置或移除HtmlElement的属性(本身Html DOM 存在的，不是自己指定的)

GetStyleAttribute(),

SetStyleAttribute(),

RemoveStyleAttribute()：得到或者设置或移除HtmlElement的样式属性

GetProperty() and

SetProperty()：得到或者设置HtmlElement的属性(自己添加的或者是作为了HtmlElement的一部分的属性比如 innerHTML)

AttachEvent() and

DetachEvent()：附加和移除JS脚本事件

HTML DOM 的事件:

onchange 值改变的时候触发

onclick 单击事件

onmouseover 鼠标悬浮事件

onmouseout 鼠标离开事件

onkeydown 键盘按下事件

onkeyup 键盘放开事件

onselect 当Select被选择时候

onfocus 获得焦点

onblur 失去焦点

onabort 用户去掉图片下载

onerror 发生错误时候

onload 页面加载事件

onunload 页面关闭(或者通过超链跳转，新页面显示之前执行)

在Silverlight调用JS方法的：

第一种调用方法：

现有JS函数如下：

使用ScriptObject对象实现调用，通过HtmlPage.Window.GetProperty("changeParagraph")得到Object对象，其中的参数就是JS方法的名称

然后使用ScriptObject调用InvokeSelf方法，参数就是JS方法的参数(如果有参数就传递，否则就不传递)

第二种方法：

这个JS方法使用了对象的方式，并且还赋予了属性为一个Function

可以看到获取ScriptObject的方式变化了，因为这个JS使用了对象的方式在使用，同时他的属性prototype有一个Display的属性(一个Function)，

然后使用ScriptObject对象的Invoke方法参数为prototype的属性名称。

在JS中访问Silverlight中的函数：

①脚本化的类必须是 public 的

②需要脚本化的属性、方法、事件要标记为 [ScriptableMember]

③如果类(XAML页面)被标记为 [ScriptableType]，则意味着其属性、方法、事件都是可被访问的

④使用HtmlPage.RegisterScriptableObject()或者HtmlPage.RegisterCreateableType()进行注册，

前者注册一个对象，后者注册一个类型

⑤给我们的obejct标签添加一个唯一的ID(在JS中通过这个插件来访问Silverlight注册的函数)

看看类的代码实现：

然后在一个XAML中进行注册：

在JS中访问：

注册一个XAML页面：

JS中的调用

和刚才的方式一摸一样

上边的例子是使用 HtmlPage.RegisterScriptableObject的方式注册一个对象，接下来使用HtmlPage.RegisterCreateableType注册一个类型：

看看类的代码，一个简单的类和简单的方法：

在XAML中进行注册：

第一个参数只是对象的名字称号，第二个就是类型

在JS中访问这个类中的这个GetRandomNumberInRange方法：

看到和上边的区别了吧，没错上边是“document.getElementById("xaml1").content.scriptable;”而这里是使用content.services.createObject()方法，

参数就是在XAML中使用“HtmlPage.RegisterCreateableType”注册的第一个参数，得到一个注册的对象，然后使用对象访问GetRandomNumberInRange

方法，如果有参数则传递。

HTML和Silverlight交互的安全性，下边这两个配置可以保护：

&lt;param name="enableHtmlAccess" value="false" /&gt;设置为false之后则无法使用Document, Window, Plugin, BrowserInformation ，但是可以使用HtmlPage.PopupWindow();

&lt;param name="allowHtmlPopupwindow" value="false" /&gt;如果为false，则无法使用HtmlPage.PopupWindow();

好了，Silverlight和HTML的交互就到这里吧，希望大家指出错误的地方。