Silverlight里访问html元素

适用范围:silverlight1.1 语言:C#

想象javascript那样访问html元素吗?我们都知道可以通过javascript来访问html元素,这个技术就是我们大家现在所知道的DOM(Document Object Model)--由W3C标准制订.

其实在silverlight里也可以用C#代码来很方便的访问html元素.

首先你要做的是引用如下名称空间:

C#代码
  1. using System.Windows.Browser;  

 

首先看看一个静态(static)对象HtmlPage,其提供了关于浏览器的信息的属性.通过HtmPage对象提供的方法你可以以程序的方式方便的跳转到其他Web页:

HtmlPage对象

BrowserInformation属性:BrowserVersion浏览器信息; Platform 操作系统.;UserAgent 如MSIE 或Firefox还有版本号;

Navigate方法:跳转到其他页或网站,如:HtmlPage.Navigate(http://www.aspstat.com);

通过HtmlPage还可以访问DOM的核心document object(HtmlDocument类型),然后你就可以通过HtmlDocument来访问页面HTML元素.

如:HtmlDocument  doc = HtmlPage.Document.

修改页面属性:

如,修改页面标题:

doc.SetProperty( "title" , "坏坏的网志");

或者修改背景颜色:

doc.SetProperty("bgcolor" ,"red");

访问HTML元素

现在,让我们通过GetAttribute/SetAttribute,GetStyleAttribute/SetStyleAttribute方法来访问/修改指定的HTML元素.

HTML Element:<span id="msg">hello</span>

Silverlight in C#:

C#代码
  1. HtmlElement elem = doc.GetElementByID("msg");   
  2. // 修改内容   
  3. elem.SetAttribute("innerHTML""New text");    
  4. // 修改背景颜色   
  5. elem.SetStyleAttribute("background""green");   
  6. // 修改文字颜色   
  7. elem.SetStyleAttribute("color""white");  

 

HTML Element: <input id="tbName" type="text"/>

Silverlight in C#:

C#代码
  1. HtmlElement elem = doc.GetElementByID("tbName");   
  2. // 读值   
  3. string s = elem.GetAttribute("value");   
  4. // 修改值   
  5. elem.SetAttribute("value""Your name");  

 

HTML Element:<img id="imgMe" src="me.jpg" />

Silverlight in C#;

C#代码
  1. HtmlElement elem = doc.GetElementByID("imgMe");   
  2. //修改图片   
  3. elem.SetAttribute("src","You.jpg");  

HTML Element:

<select id="cities"><option>北京</option><option>上海</opiton><option>深圳</option></select>

Silverlight in C#:

C#代码
  1. HtmlElement elem  = doc.GetElementByID("cities");   
  2. //获取select选中内容的index   
  3. string s = elem.GetAttribute("selectedIndex");  

 

事件绑定

把事件注册到受管代码(C#)下处理,用来代替以前的通过javascript来处理.(PS:Flash下好象也可以,嚯嚯,还是比较喜欢C#的语法和VS开发IDE)

例如,用C#来处理一个按钮事件:

C#代码
  1. HtmlElement elem = doc.GetElementByID("btbGo");      
  2. elem.AttachEvent("onclick"new EventHandler<HtmlEventArgs>(this.btnGo_onClick));      
  3.    .....      
  4. //e.SourceElement引用时间触发对象   
  5. void btnGo_onClick(object sender, HtmlEventArgs e)      
  6. {      
  7.    .....      
  8. }    

 

OK,完毕.silverlight让client的富煤体和client编程变的so easy.嘎嘎,加油;欢迎大家多多交流学习哈,偶的BLOG:http://www.aspstat.com/

posted @ 2007-10-26 22:00  坏坏@net  阅读(2331)  评论(5编辑  收藏  举报