Accedere al DOM di una pagina HTML da Silverlight 2.0

Silverlight è un potente strumento che permette di creare applicazioni web più ricche, ma sebbene possa sostituire anche interamente i normali elementi HTML, si possono verificare situazioni in cui le pagine sono miste e formate in parte da zone sviluppate in Silverlight e da altre realizzate con (X)HTML. In questi casi può inoltre essere necessario far comunicare i due mondi, per esempio per manipolare oggetti HTML da Silverlight o interagire con il browser.

In Silverlight 2.0 è presente un namespace System.Windows.Browser che contiene una serie di classi che permettono di raggiungere questo scopo la cui classe principale è HtmlPage. Questa dispone di alcune proprietà statiche pubbliche, dal nome già comprensibile al loro scopo, come Document, Plugin, BrowserInformation e Window.

La proprietà HtmlPage.Document permette di accedere al nodo principale della pagina, nella quale è contenuto il plugin di Silverlight, e di operare con le comuni operazioni che si possono effettuare solitamente in JavaScript. Di seguito un esempio per inteccettare gli eventi di movimento e uscita del mouse, su un bottone con ID sampleButton:

HtmlElement sampleButton = HtmlPage.Document.GetElementById("sampleButton"); 
 
sampleButton.AttachEvent("onmousemove", SampleButton_MouseOver); 
 
sampleButton.AttachEvent("onmouseleave", SampleButton_MouseLeave); 

Il gestore degli eventi ha una particolare firma che permette di accedere ai più comuni dati, quali posizione del mouse, pulsante della tastiera premuto, origine dell'evento ecc:

private void SampleButton_MouseOver(object sender, HtmlEventArgs e) 
{ 
    mousePosition.Text = String.Format("Posizione mouse: {0}:{1}", e.ClientX, e.ClientY); 
    // Cambio il colore del pulsante 
    ((HtmlElement)e.Source).SetStyleAttribute("color", "red"); 
}

Tra i vari metodi e proprietà, utili sono quelli per la manipolazione dell'alberto degli elementi presenti nella pagina. I metodi AppendChild e RemoveChild permettono di aggiungere e rimuovere figli, mentre con Document.CreateElement è possibile creare un nuovo oggetto e inserirlo nel grafo:

// Recupero l'oggetto select 
HtmlElement sampleSelect = HtmlPage.Document.GetElementById("sampleSelect"); 
 
// Creo una nuova option 
HtmlElement option = HtmlPage.Document.CreateElement("option"); 
sampleSelect.AppendChild(option); 
 
int c = sampleSelect.Children.Count; 
// Imposto il valore 
option.SetAttribute("value", c.ToString()); 
// Imposto il testo 
option.SetAttribute("text", "Opzione " + c); 
// Autoseleziono l'elemento 
option.SetProperty("selected", "true");

La proprietà HtmlPage.BrowserInformation invece contiene alcune informazioni su piattaforma (Platform), tipo di browser (UserAgent) e consente di sapere se i cookies sono abilitati (CookiesEnabled). Bisogna inoltre ricordare che questo strumento gode delle performance date dal CLR incluso nel plugin di Silverlight ed è possibile inoltre abbinarlo all'uso di LINQ to Object che lo rende di gran lunga più comodo rispetto a JavaScript.