Procedura: modificare gli stili di un elemento nel Document Object Model HTML gestito

Aggiornamento: novembre 2007

È possibile utilizzare stili in HTML per controllare l'aspetto di un documento e dei relativi elementi. Le classi HtmlDocument e HtmlElement supportano le proprietà Style che accettano stringhe di stile del formato seguente:

name1:value1;...;nameN:valueN;

Nell'esempio seguente è riportato un DIV con una stringa di stile in cui il testo è impostato sul tipo di carattere Arial e sul grassetto:

Hello, world!

</DIV>

Il problema della gestione degli stili con la proprietà Style consiste nella difficoltà nell'aggiungere e rimuovere singole impostazioni di stile dalla stringa. Sarebbe ad esempio difficile trasformare il testo precedente in corsivo ogni volta che il cursore viene posizionato su un elemento DIV e annullare l'applicazione del corsivo quando il cursore viene spostato dall'elemento DIV. Se si dovessero gestire molti stili in tal modo, il fattore tempo diventerebbe un problema.

Nella procedura seguente è contenuto codice che è possibile utilizzare per gestire facilmente stili in documenti ed elementi HTML. La procedura presuppone esperienza nell'esecuzione delle attività di base in Windows Form, quali la creazione di un nuovo progetto e l'aggiunta di un controllo a un form.

Per elaborare modifiche di stile in un'applicazione Windows Form

Creare un nuovo progetto Windows Form.
Creare un nuovo file di classe con l'estensione corretta per il linguaggio di programmazione utilizzato.
Copiare il codice della classe StyleGenerator riportato nella sezione Esempio del presente argomento nel file di classe e salvarlo.

Salvare il testo HTML seguente in un file denominato Test.htm.

<HTML>
    <BODY>

        <DIV style="font-face:arial;font-weight:bold;">
            Hello, world!
        </DIV><P>

        <DIV>
            Hello again, world!
        </DIV><P>

    </BODY>
</HTML>

Aggiungere un controllo WebBrowser denominato webBrowser1 al form principale del progetto.

Aggiungere il codice riportato di seguito al file di codice del progetto.

Nota importante:
Assicurarsi che il gestore eventi webBrowser1_DocumentCompleted sia configurato come listener per l'evento DocumentCompleted. In Visual Studio fare doppio clic sul controllo WebBrowser. In un editor di testo configurare il listener a livello di codice.

<System.Security.Permissions.PermissionSet(Security.Permissions.SecurityAction.Demand, Name:="FullTrust")> _
Public Class Form1

    Dim SG As StyleGenerator = Nothing
    Dim Elem As HtmlElement = Nothing
    Dim WithEvents DocumentEvents As HtmlDocument

    Private Sub WebBrowser1_DocumentCompleted(ByVal sender As System.Object, ByVal e As System.Windows.Forms.WebBrowserDocumentCompletedEventArgs) Handles WebBrowser1.DocumentCompleted
        SG = New StyleGenerator()
        DocumentEvents = WebBrowser1.Document
    End Sub

    Private Sub Document_MouseOver(ByVal sender As Object, ByVal e As HtmlElementEventArgs) Handles DocumentEvents.MouseOver
        Elem = WebBrowser1.Document.GetElementFromPoint(e.MousePosition)
        If Elem.TagName.Equals("DIV") Then
            SG.ParseStyleString(Elem.Style)
            SG.SetStyle("font-style", "italic")
            Elem.Style = SG.GetStyleString()
        End If
    End Sub

    Private Sub Document_MouseLeave(ByVal sender As Object, ByVal e As HtmlElementEventArgs) Handles DocumentEvents.MouseLeave
        If (Elem IsNot Nothing) Then
            SG.RemoveStyle("font-style")
            Elem.Style = SG.GetStyleString()
            ' Reset, since we may mouse over a new DIV element next time.
            SG.Clear()
        End If
    End Sub
End Class

StyleGenerator sg = null;
HtmlElement elem = null;

private void webBrowser1_DocumentCompleted(object sender, WebBrowserDocumentCompletedEventArgs e)
{
    sg = new StyleGenerator();

    webBrowser1.Document.MouseOver += new HtmlElementEventHandler(Document_MouseOver);
    webBrowser1.Document.MouseLeave += new HtmlElementEventHandler(Document_MouseLeave);
}

void Document_MouseOver(object sender, HtmlElementEventArgs e)
{
    elem = webBrowser1.Document.GetElementFromPoint(e.MousePosition);
    if (elem.TagName.Equals("DIV"))
    {
        sg.ParseStyleString(elem.Style);
        sg.SetStyle("font-style", "italic");
        elem.Style = sg.GetStyleString();
    }
}

void Document_MouseLeave(object sender, HtmlElementEventArgs e)
{
    if (elem != null)
    {
        sg.RemoveStyle("font-style");
        elem.Style = sg.GetStyleString();
        // Reset, since we may mouse over a new DIV element next time.
        sg.Clear();
    }
}

Eseguire il progetto. Spostare il cursore sul primo elemento DIV e osservare gli effetti del codice.

Esempio

Il codice completo per la classe StyleGenerator, illustrato nell'esempio di codice riportato di seguito, analizza un valore di stile esistente, supporta l'aggiunta, la modifica e la rimozione di stili e restituisce un valore di stile con le modifiche richieste.

Imports System
Imports System.Collections.Generic
Imports System.Text

Public Class StyleGenerator
    Dim styleDB As Dictionary(Of String, String)

    Public Sub New()
        styleDB = New Dictionary(Of String, String)()
    End Sub


    Public Function ContainsStyle(ByVal name As String) As Boolean
        Return styleDB.ContainsKey(name)
    End Function


    Public Function SetStyle(ByVal name As String, ByVal value As String) As String
        Dim oldValue As String = ""

        If (Not name.Length > 0) Then
            Throw New ArgumentException("Parameter name cannot be zero-length.")
        End If
        If (Not value.Length > 0) Then
            Throw New ArgumentException("Parameter value cannot be zero-length.")
        End If

        If (styleDB.ContainsKey(name)) Then
            oldValue = styleDB(name)
        End If

        styleDB(name) = value

        Return oldValue
    End Function

    Public Function GetStyle(ByVal name As String) As String
        If (Not name.Length > 0) Then
            Throw New ArgumentException("Parameter name cannot be zero-length.")
        End If

        If (styleDB.ContainsKey(name)) Then
            Return styleDB(name)
        Else
            Return ""
        End If
    End Function

    Public Sub RemoveStyle(ByVal name As String)
        If (styleDB.ContainsKey(name)) Then
            styleDB.Remove(name)
        End If
    End Sub

    Public Function GetStyleString() As String
        If (styleDB.Count > 0) Then
            Dim styleString As New StringBuilder("")
            Dim key As String
            For Each key In styleDB.Keys
                styleString.Append(String.Format("{0}:{1};", CType(key, Object), CType(styleDB(key), Object)))
            Next key

            Return styleString.ToString()
        Else
            Return ""
        End If
    End Function

    Public Sub ParseStyleString(ByVal styles As String)
        If (styles.Length) > 0 Then
            Dim stylePairs As String() = styles.Split(New Char() {";"c})
            Dim stylePair As String
            For Each stylePair In stylePairs
                If (stylePairs.Length > 0) Then
                    Dim styleNameValue As String() = stylePair.Split(New Char() {":"c})
                    If (styleNameValue.Length = 2) Then
                        styleDB(styleNameValue(0)) = styleNameValue(1)
                    End If
                End If
            Next stylePair
        End If
    End Sub


    Public Sub Clear()
        styleDB.Clear()
    End Sub
End Class

using System;
using System.Collections.Generic;
using System.Text;

namespace ManagedDOMStyles
{
    public class StyleGenerator
    {
        private Dictionary<string, string> styleDB;

        public StyleGenerator()
        {
            styleDB = new Dictionary<string, string>();
        }

        public bool ContainsStyle(string name)
        {
            return(styleDB.ContainsKey(name));
        }

        public string SetStyle(string name, string value)
        {
            string oldValue = "";

            if (!(name.Length > 0))
            {
                throw (new ArgumentException("Parameter name cannot be zero-length."));
            }
            if (!(value.Length > 0))
            {
                throw (new ArgumentException("Parameter value cannot be zero-length."));
            }

            if (styleDB.ContainsKey(name))
            {
                oldValue = styleDB[name];
            }

            styleDB[name] = value;

            return (oldValue);
        }

        public string GetStyle(string name)
        {
            if (!(name.Length > 0))
            {
                throw (new ArgumentException("Parameter name cannot be zero-length."));
            }

            if (styleDB.ContainsKey(name))
            {
                return (styleDB[name]);
            }
            else
            {
                return ("");
            }
        }

        public void RemoveStyle(string name)
        {
            if (styleDB.ContainsKey(name))
            {
                styleDB.Remove(name);
            }
        }

        public string GetStyleString()
        {
            if (styleDB.Count > 0)
            {
                StringBuilder styleString = new StringBuilder("");
                foreach (string key in styleDB.Keys)
                {
                    styleString.Append(String.Format("{0}:{1};", (object)key, (object)styleDB[key]));
                }

                return (styleString.ToString());
            }
            else
            {
                return ("");
            }
        }

        public void ParseStyleString(string styles)
        {
            if (styles.Length > 0)
            {
                string[] stylePairs = styles.Split(new char[] { ';' });
                foreach(string stylePair in stylePairs)
                {
                    if (stylePairs.Length > 0)
                    {
                        string[] styleNameValue = stylePair.Split(new char[] { ':' });
                        if (styleNameValue.Length == 2)
                        {
                            styleDB[styleNameValue[0]] = styleNameValue[1];
                        }
                    }
                }
            }
        }

        public void Clear()
        {
            styleDB.Clear();
        }
    }
}

Vedere anche

Riferimenti

HtmlElement

Last updated on 2008-09-12

Procedura: modificare gli stili di un elemento nel Document Object Model HTML gestito

Per elaborare modifiche di stile in un'applicazione Windows Form

Esempio

Vedere anche

Riferimenti

Risorse aggiuntive