Sobre XML e XSLT

Última atualização em 25 de abr de 2024

Use XML e XSLT com páginas da Web do Dreamweaver.

Nota

A interface de usuário foi simplificada no Dreamweaver 2017. Logo, talvez você não consiga encontrar algumas das opções descritas neste artigo no Dreamweaver 2017 e em versões posteriores. Para obter mais informações, consulte este artigo (em inglês).

Usar XML e XSL com páginas da Web

Extensible Markup Language (XML) é uma linguagem que permite estruturar informações. Como HTML, XML permite estruturar informações usando tags, mas as tags XML não são predefinidas como as tags HTML. Em vez disso, XML permite criar tags que melhor definem a estrutura de dados (esquema). As tags são aninhadas dentro de outras para criar um esquema de tags principais e secundárias. Como a maioria das tags HTML, todas as tags em um esquema XML têm uma tag de abertura e fechamento.

O exemplo a seguir mostra a estrutura básica de um arquivo XML:

<?xml version="1.0">

<mybooks>

<book bookid="1">

<pubdate>03/01/2004</pubdate>

<title>Displaying XML Data with Adobe Dreamweaver</title>

<author>Charles Brown</author>

</book>

<book bookid="2">

<pubdate>04/08/2004</pubdate>

<title>Understanding XML</title>

<author>John Thompson</author>

</book>

</mybooks>

Neste exemplo, cada tag principal <book> contém três tags secundárias: <pubdate>, <title> e <author>. Mas cada tag <book> também é uma tag secundária da tag <mybooks>, que está um nível acima no esquema. É possível nomear e estruturar as tags XML de qualquer forma, desde que você aninhe as tags adequadamente dentro de outras e atribua a cada tag de abertura uma tag de fechamento correspondente.

Os documentos XML não contêm nenhuma formatação — são simplesmente contêineres de informações estruturadas.Depois de ter um esquema XML, é possível usar a Extensible Stylesheet Language (XSL) para exibir as informações. Da mesma forma que Cascading Style Sheets (CSS) permitem formatar HTML, XSL permite formatar dados XML. É possível definir estilos, elementos da página, layout e assim por diante em um arquivo XSL e anexá-lo a um arquivo XML para que, quando um usuário visualizar os dados XML em um navegador, os dados sejam formatados de acordo com o que foi definido no arquivo XSL. O conteúdo (os dados XML) e a apresentação (definida pelo arquivo XSL) são totalmente separados, proporcionando maior controle sobre como suas informações aparecem em uma página da Web. Em essência, XSL é uma tecnologia de apresentação para XML, onde a saída principal é uma página HTML.

Extensible Stylesheet Language Transformations (XSLT) é uma linguagem subconjunto de XSL que permite exibir dados XML em uma página da Web e "transformá-los", junto com estilos XSL, em informações legíveis e estilizadas na forma de HTML. Você pode usar o Dreamweaver para criar páginas XSLT que permitem executar transformações XSL usando um servidor de aplicativo ou um navegador. Em uma transformação XSL do lado do servidor, o servidor faz o trabalho de transformar o XML e XSL, e exibi-lo na página. Em uma transformação do lado do cliente, um navegador (como o Internet Explorer) faz o trabalho.

A abordagem que você escolher (transformações do lado do servidor versus transformações do lado do cliente) depende do que você está tentando alcançar como resultado final, das tecnologias disponíveis, do nível de acesso que você tem aos arquivos de origem XML e de outros fatores.As duas abordagens têm suas vantagens e desvantagens. Por exemplo, as transformações do lado do servidor funcionam em todos os navegadores, enquanto as transformações do lado do cliente são restritas apenas a navegadores modernos (Internet Explorer 6, Netscape 8, Mozilla 1.8 e Firefox 1.0.2). As transformações do lado do servidor permitem exibir dados XML dinamicamente do seu próprio servidor ou de qualquer outro lugar na web, enquanto as transformações do lado do cliente devem usar dados XML hospedados localmente no seu próprio servidor web. Por fim, as transformações do lado do servidor exigem que você implante suas páginas em um servidor de aplicativo configurado, enquanto as transformações do lado do cliente apenas exigem acesso a um servidor web.

Para assistir a um tutorial e saber mais sobre XML, consulte www.adobe.com/go/vid0165_br.

Transformações XSL do servidor

Dreamweaver oferece métodos para criar páginas XSLT que permitem executar transformações XSL do lado do servidor.Quando um servidor de aplicativo executa a transformação XSL, o arquivo contendo os dados XML pode residir no seu próprio servidor ou em qualquer outro lugar na web. Além disso, qualquer navegador pode exibir os dados transformados. A implantação de páginas para transformações do lado do servidor, no entanto, é um pouco complexa e exige que você tenha acesso a um servidor de aplicativo.

Ao trabalhar com transformações XSL do lado do servidor, você pode usar o Dreamweaver para criar páginas XSLT que geram documentos HTML completos (páginas XSLT inteiras) ou fragmentos XSLT que geram uma parte de um documento HTML. Uma página XSLT inteira é similar a uma página HTML comum. Ela contém uma tag <body> e uma tag <head>, e permite exibir uma combinação de dados HTML e XML na página.Um fragmento XSLT é um pedaço de código, usado por um documento separado, que exibe dados XML formatados. Ao contrário de uma página XSLT inteira, é um arquivo independente que não contém nenhuma tag <body> ou <head>.Se você quiser exibir dados XML em uma página própria, você criaria uma página XSLT inteira e vincularia seus dados XML a ela. Se, por outro lado, você quisesse exibir dados XML em uma seção específica de uma página dinâmica existente—por exemplo, uma página inicial dinâmica para uma loja de artigos esportivos, com pontuações esportivas de um feed RSS exibidas de um lado da página—você criaria um fragmento XSLT e inseriria uma referência a ele na página dinâmica. Criar fragmentos XSLT e usá-los em conjunto com outras páginas dinâmicas para exibir dados XML é o cenário mais comum.

O primeiro passo na criação desses tipos de páginas é criar o fragmento XSLT. É um arquivo separado que contém o layout, a formatação e assim por diante dos dados XML que você deseja exibir na página dinâmica.Depois de criar o fragmento XSLT, você insere uma referência a ele na página dinâmica (por exemplo, uma página PHP ou ColdFusion).A referência inserida ao fragmento funciona de forma muito parecida com um Server Side Include (SSI) — os dados XML formatados (o fragmento) residem em um arquivo separado, enquanto na exibição Design, um espaço reservado para o fragmento aparece na própria página dinâmica.Quando um navegador solicita a página dinâmica contendo a referência ao fragmento, o servidor processa a instrução incluída e cria um novo documento no qual o conteúdo formatado do fragmento aparece em vez do espaço reservado.

A. Navegador solicita a página dinâmica. B. O servidor web localiza a página e a passa para o servidor de aplicativos C. Servidor de aplicativo rastreia a página em busca de instruções e obtém fragmento do XSLT. D. Servidor de aplicativo executa transformação (lê o fragmento do XSLT, obtém e formata os dados xml). E. Servidor de aplicativo insere o fragmento transformado na página e a passa de volta para o servidor Web. F. Servidor Web envia a página concluída para o navegador. 

Você usa o comportamento de servidor de Transformação XSL para inserir a referência a um fragmento XSLT em uma página dinâmica.Quando você insere a referência, o Dreamweaver gera uma pasta includes/MM_XSLTransform/ na pasta raiz do site que contém um arquivo de biblioteca de tempo de execução.O servidor de aplicativo usa as funções definidas neste arquivo ao transformar os dados XML especificados. O arquivo é responsável por buscar os dados XML e fragmentos XSLT, executar a transformação XSL e gerar os resultados na página da Web.

O arquivo contendo o fragmento XSLT, o arquivo XML contendo seus dados e o arquivo de biblioteca de tempo de execução gerado devem estar todos no servidor para que sua página seja exibida corretamente. (Se você selecionar um arquivo XML remoto como sua fonte de dados—um de um feed RSS, por exemplo—esse arquivo deve, é claro, residir em algum outro lugar na Internet.)

Você também pode usar o Dreamweaver para criar páginas XSLT inteiras para uso com transformações do lado do servidor. Uma página XSLT inteira funciona exatamente da mesma forma que um fragmento XSLT, apenas quando você insere a referência à página XSLT inteira usando o comportamento de servidor XSL Transformation, está inserindo o conteúdo completo de uma página HTML. Assim, a página dinâmica (a página .cfm, .php ou .asp que atua como página de contêiner) deve ser limpa de todo HTML antes de inserir a referência.

Dreamweaver oferece suporte a transformações XSL para páginas ColdFusion, ASP e PHP.

Nota

Seu servidor deve estar configurado corretamente para executar transformações do lado do servidor. Para obter mais informações, entre em contato com o administrador do servidor.

Transformações XSL do cliente

Você pode executar transformações XSL no cliente sem usar um servidor de aplicativo. Você pode usar o Dreamweaver para criar uma página XSLT inteira que fará isso; no entanto, as transformações do cliente requerem a manipulação do arquivo XML que contém os dados que deseja exibir. Além disso, as transformações do cliente funcionam somente em navegadores modernos (Internet Explorer 6, Netscape 8, Mozilla 1.8 e Firefox 1.0.2). 

Primeiro, crie uma página XSLT inteira e anexe uma fonte de dados XML. (O Dreamweaver solicita que a fonte de dados seja anexada quando a nova página é criada.) Você pode criar uma página XSLT totalmente nova ou converter uma página HTML existente em uma página XSLT. Ao converter uma página HTML existente em uma página XSLT, você deve anexar uma fonte de dados XML usando o painel Ligações (Janela > Ligações).

Depois de criar a página XSLT, você deve vinculá-la ao arquivo XML que contém os dados XML inserindo uma referência à página XSLT no próprio arquivo XML (assim como você insere uma referência a uma folha de estilos CSS externa na seção <head> de uma página HTML). Os visitantes do seu site devem exibir o arquivo XML (não a página XSLT) em um navegador. Quando os visitantes acessam a página, o navegador executa a transformação XSL e exibe os dados XML formatados pela página XSLT vinculada.

A relação entre as páginas XML e XSLT vinculadas é conceitualmente similar, embora seja diferente do modelo CSS externo/página HTML. Quando houver uma página HTML que contém o conteúdo (como texto), use uma folha de estilos externa para formatar esse conteúdo. A página HTML determina o conteúdo e o código CSS externo, que o usuário nunca vê, determina a apresentação. Com XSLT e XML, a situação é inversa. O arquivo XML (que o usuário nunca vê na forma bruta) determina o conteúdo, enquanto a página XSLT determina a apresentação. A página XSLT contém as tabelas, o layout, os gráficos e outros itens que o HTML normalmente contém. Quando um usuário visualiza o arquivo XML em um navegador, a página XSLT formata o conteúdo.

A. Navegador solicita arquivo XML. B. Servidor responde enviando arquivo XML para o navegador C. Navegador lê a diretiva XML e chama o arquivo XSLT. D. Servidor envia arquivo XSLT ao navegador. E. Navegador transforma e exibe os dados XML no navegador. 

Quando você usa o Dreamweaver para vincular uma página XSLT a uma página XML, o Dreamweaver insere o código apropriado para você no topo da página XML. Se você possuir a página XML à qual está vinculando (ou seja, se o arquivo XML exclusivamente reside no seu servidor Web), tudo o que precisa fazer é usar o Dreamweaver para inserir o código apropriado que vincula as duas páginas. Quando você possui o arquivo XML, as transformações XSL executadas pelo cliente são totalmente dinâmicas. Ou seja, sempre que você atualizar os dados no arquivo XML, qualquer saída HTML usando a página XSLT vinculada será automaticamente atualizada com as novas informações.

Nota

Os arquivos XML e XSL usados para transformações do lado do cliente devem residir no mesmo diretório. Se não estiverem, o navegador irá ler o arquivo XML e localizar a página XSLT para a transformação, mas falhará em encontrar ativos (folhas de estilo, imagens e assim por diante) definidos por links relativos na página XSLT.

Se você não possuir a página XML à qual está vinculando (por exemplo, se quiser usar dados XML de um feed RSS em algum lugar na web), o fluxo de trabalho é um pouco mais complicado. Para executar transformações do lado do cliente usando dados XML de uma origem externa, você deve primeiro baixar o arquivo de origem XML para o mesmo diretório onde sua página XSLT reside. Quando a página XML estiver no seu site local, você pode usar o Dreamweaver para adicionar o código apropriado que a vincula à página XSLT e publicar ambas as páginas (o arquivo XML baixado e a página XSLT vinculada) no seu servidor web.Quando o usuário visualiza a página XML em um navegador, a página XSLT formata o conteúdo, exatamente como no exemplo anterior.

A desvantagem de executar transformações XSL no lado do cliente em dados XML provenientes de uma origem externa é que os dados XML são apenas parcialmente "dinâmicos". O arquivo XML que você baixa e altera é apenas uma "captura" do arquivo que está em outro local na web. Se o arquivo XML original na web for alterado, você deve baixar o arquivo novamente, vinculá-lo à página XSLT e publicar novamente o arquivo XML no seu servidor web.O navegador renderiza apenas os dados que recebe do arquivo XML em seu servidor web, não os dados contidos no arquivo XML de origem.

Dados XML e elementos repetitivos

O objeto XSLT de Região de Repetição permite exibir elementos repetitivos de um arquivo XML em uma página.Qualquer região que contenha um espaço reservado para dados XML pode ser transformada em uma região repetida. No entanto, as regiões mais comuns são uma tabela, uma linha de tabela ou uma série de linhas de tabela.

O exemplo a seguir mostra como o objeto XSLT Região de repetição é aplicado a uma linha de tabela que exibe informações de menu de um restaurante. A linha inicial exibe três elementos diferentes do esquema XML: item, descrição e preço. Quando o objeto XSLT Região de repetição é aplicado à linha de tabela e a página é processada por um aplicativo servidor ou navegador, a tabela é repetida com dados únicos inseridos em cada nova linha de tabela.

Quando você aplica um objeto XSLT de região de repetição a um elemento na janela Documento, um contorno cinza fino com abas aparece ao redor da região repetida.Quando você visualiza seu trabalho em um navegador (Arquivo > Visualizar no navegador), o contorno cinza desaparece e a seleção se expande para exibir os elementos repetitivos especificados no arquivo XML, como na ilustração anterior.

Quando você adiciona o objeto XSLT Região de repetição à página, o comprimento do espaço reservado para dados XML na janela Documento é truncado. Isso ocorre porque o Dreamweaver atualiza a expressão XPath (linguagem de caminho XML) para o espaço reservado de dados XML para que ela seja relativa ao caminho do elemento repetitivo.

Por exemplo, o código a seguir é para uma tabela que contém dois espaços reservados dinâmicos, sem um objeto XSLT Região de repetição aplicado à tabela:

<table width="500" border="1">

<tr>

<td><xsl:value-of select="rss/channel/item/title"/></td>

</tr>

<tr>

<td><xsl:value-of select="rss/channel/item/description"/></td>

</tr>

</table>

O código a seguir é para a mesma tabela com o objeto XSLT Região de repetição aplicado a ela:

<xsl:for-each select="rss/channel/item">

<table width="500" border="1">

<tr>

<td><xsl:value-of select="title"/></td>

</tr>

<tr>

<td><xsl:value-of select="description"/></td>

</tr>

</table>

</xsl:for-each>

No exemplo anterior, o Dreamweaver atualizou o XPath para os itens que ficam dentro da região repetir (título e descrição) para ser relativo ao XPath nas tags <xsl:for-each> circundantes, em vez de todo o documento.

O Dreamweaver gera expressões XPath relativas ao contexto em outros casos também. Por exemplo, se você arrastar um espaço reservado de dados XML para uma tabela que já tem um objeto XSLT de região de repetição aplicado a ela, o Dreamweaver automaticamente exibe o XPath relativo ao XPath existente nas tags <xsl:for-each> delimitadoras.

Visualizar dados XML

Quando você usar Visualizar no navegador (Arquivo > Visualizar no navegador) para visualizar dados XML inseridos em um fragmento XSLT ou uma página XSLT inteira, o mecanismo que executa a transformação XSL difere de situação para situação. Para páginas dinâmicas que contêm fragmentos XSLT, o servidor do aplicativo sempre executa a transformação. Outras vezes, o Dreamweaver ou o navegador podem estar executando a transformação.

A tabela a seguir resume as situações ao usar Visualizar no navegador e os mecanismos que executam as respectivas transformações:

Tipo de página visualizada no navegador

Transformação dos dados executada por

Página dinâmica que contém um fragmento XSLT

Servidor de aplicativo

Fragmento XSLT ou página XSLT inteira

Dreamweaver

Arquivo XML vinculado a uma página XSLT inteira

Navegador

Os tópicos a seguir oferecem diretrizes para ajudar você a determinar os métodos de visualização apropriados, com base nas suas necessidades.

Visualização de páginas para transformações do servidor

No caso de transformações no lado do servidor, o conteúdo que o visitante do site vê por fim é transformado pelo servidor do aplicativo. Ao criar XSLT e páginas dinâmicas para uso com transformações no lado do servidor, é sempre preferível visualizar a página dinâmica que contém o fragmento XSLT em vez do fragmento XSLT em si. No primeiro cenário, você utiliza o servidor do aplicativo, que garante que a visualização seja consistente com o que os visitantes do site verão quando visitarem a página. Nesse último cenário, o Dreamweaver executa a transformação e pode fornecer resultados ligeiramente inconsistentes.Você pode usar o Dreamweaver para visualizar o fragmento XSLT enquanto o está criando, mas poderá ver os resultados mais precisos da renderização de dados se usar o servidor do aplicativo para visualizar a página dinâmica depois de inserir o fragmento XSLT.

Visualização de páginas para transformações do cliente

No caso de transformações do lado do cliente, o conteúdo que o visitante do site vê por fim é transformado por um navegador.Você faz isso adicionando um link do arquivo XML à página XSLT. Se você abrir o arquivo XML no Dreamweaver e visualizá-lo em um navegador, forçará o navegador a carregar o arquivo XML e executar a transformação. Isso oferece a mesma experiência que a do visitante do site.

No entanto, usar essa abordagem torna mais difícil depurar a página porque o navegador transforma o XML e gera o HTML internamente. Se você selecionar a opção Exibir origem do navegador para depurar o HTML gerado, verá apenas o XML original que o navegador recebeu, não o HTML completo (tags, estilos e assim por diante) responsável pela renderização da página. Para ver o HTML completo ao visualizar o código de origem, você deve visualizar a página XSLT em um navegador.

Visualização de páginas XSLT inteiras e de fragmentos XSLT

Ao criar páginas XSLT inteiras e fragmentos XSLT, você vai querer visualizar seu trabalho para garantir que os dados estejam sendo exibidos corretamente. Se você usar Visualizar no navegador para exibir uma página XSLT inteira ou um fragmento XSLT, Dreamweaver executa a transformação usando um mecanismo de transformação integrado.Este método oferece resultados rápidos e facilita a criação e a depuração incremental da página.Também oferece uma maneira de visualizar o HTML completo (tags, estilos e assim por diante) selecionando a opção Exibir origem no navegador.

Nota

Este método de visualização é comumente usado quando você começa a criar páginas XSLT, independentemente de usar o cliente ou o servidor para transformar os dados.