Como: Alterar estilos de um elemento no modelo de objeto gerenciado do documento HTML

Artigo
08/01/2011

Você pode usar os estilos em HTML para controlar a aparência de um documento e seus elementos. HtmlDocumente HtmlElement suporte Style Propriedades que usem cadeias de caracteres de estilo do seguinte formato:

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

Aqui está uma DIV com uma seqüência de estilo que define a fonte Arial e todo o texto para negrito:

Hello, world!

</DIV>

O problema com a manipulação de estilos usando o Style propriedade é que ele pode ser inconveniente para adicionar e remover definições de estilo individuais da seqüência de caracteres. Por exemplo, ele se tornar um procedimento complexo para você processar o texto anterior em itálico, sempre que o usuário posiciona o cursor sobre o DIVe levar o itálico logoff quando o cursor deixa o DIV. Tempo se torna um problema se você precisar manipular um grande número de estilos dessa maneira.

O procedimento a seguir contém código que você pode usar para manipular facilmente os estilos em documentos HTML e elementos. O procedimento requer que você sabe como executar tarefas básicas no Windows Forms, como, por exemplo, criar um novo projeto e adicionar um controle a um formulário.

Para processar alterações de estilo em um aplicativo Windows Forms

Crie um novo projeto Windows Forms.
Crie um novo arquivo de classe, terminando na extensão apropriada para sua linguagem de programação.
Cópia de StyleGenerator código de classe na seção exemplo deste tópico para o arquivo de classe e salvar o código.

Salve o seguinte HTML em um arquivo chamado Test. htm.

<HTML>
    <BODY>

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

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

    </BODY>
</HTML>

Adicionar um WebBrowser controle chamado webBrowser1 para o formulário principal do projeto.

Adicione o seguinte código ao arquivo de código do projeto.

Importante
Certifique-se de que o webBrowser1_DocumentCompleted manipulador de eventos está configurado como um ouvinte para o DocumentCompleted de evento. Em Visual Studio, clique duas vezes sobre o WebBrowser controle; em um editor de texto, configure o ouvinte programaticamente.

<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();
    }
}

Execute o projeto. Executar o seu cursor sobre o primeiro DIV para observar os efeitos do código.

Exemplo

O exemplo de código a seguir mostra o código completo para o StyleGenerator classe, que analisa um valor de estilo existente, suporta a adição, a alteração e a remoção de estilos e retorna um novo valor de estilo com as alterações solicitadas.

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();
        }
    }
}

Consulte também

Referência

HtmlElement

Partilhar via

Como: Alterar estilos de um elemento no modelo de objeto gerenciado do documento HTML

Para processar alterações de estilo em um aplicativo Windows Forms

Exemplo

Consulte também

Referência

Recursos adicionais