2009-06-24 26 views
10

Tengo una transformación XSL que genera HTML. En el elemento head tengo una referencia de archivo CSS.Cómo copiar CSS y JavaScript externos en XSLT

<link rel="stylesheet" type="text/css" href="css/styles.css"/> 

me gustaría crear un resultado HTML independiente sin referencias externas y por lo tanto me gustaría incluir referencias CSS externos. Para evitar la duplicación de código, no quiero codificar los estilos en la plantilla XSLT, así que estoy buscando algún comando XSLT para copiar el contenido del archivo CSS. Sé que xsl:include o xsl:import no funcionarán, ya que esperan archivos XSLT. Tampoco lo hace

<xsl:copy-of select="document('css/styles.css')"/> 

, ya que espera que algo XML sea compatible.

También tengo algunas declaraciones de funciones de JavaScript que me gustaría copiar también.

¿Esto es posible con XSLT puro, o tendré que hacer un preprocesamiento del archivo XSLT (o postprocesamiento del archivo HTML)?

Respuesta

10

XSLT 2.0 proporciona la función de texto no analizado() para leer documentos a través de URL que no son XML.

En XSLT 1.0, si no necesita ser demasiado script sobre CSS, puede usar lo siguiente para hacer que el archivo CSS sea compatible con XML. Y, afortunadamente, los navegadores toleran los comentarios HTML.

CSS

<!--/*--><root><![CDATA[<!--*/--> 
body 
{ 
    margin: 0; 
} 
div > p 
{ 
    background-color: yellow; 
} 
<!--/*-->]]></root><!--*/--> 

XSLT

<style type="text/css"> 
    <xsl:value-of select="document('test.css')" disable-output-escaping="yes" /> 
</style> 
+3

Esto funciona para mí. Hay problemas con < > y caracteres. Terminé con y ]]> Funciona también para javascript. – GrGr

+0

¿Puedes mostrar tu archivo xslt ahora? –

0

Tal vez podría engañarlo haciéndole creer que la hoja de estilo es XML.

styles.css

/* 
<?xml version="1.0" encoding="utf-8"?> 
<style> 
<![CDATA[ 
*/ 
... styles ... 
/* 
]]> 
</style> 
*/ 

Es un truco, pero si no hay otra forma en que puede ser suficiente (suponiendo que funciona en absoluto).

+1

Lo cual no funcionará porque el texto CCS no es texto XML válido en ningún caso. Piense en los selectores "div> p", o todas las comillas dobles sin guardar en declaraciones de fuentes, por ejemplo. – Tomalak

+0

A continuación, agregue una sección CDATA. Respuesta actualizada para mostrar el uso. – SpliFF

+0

No, incluso con CDATA. xsltproc no le gusta el signo de comentario. Dice: css/styles.css: 1: error del analizador: etiqueta de inicio esperada, '<' no encontrada /* ^ – GrGr

0

Usar una instrucción de procesamiento para envolver el contenido CSS:

<?xml version="1.0" encoding="utf-8"?> 
    <root> 
    <?wrapper html 
     <html> 
     <link rel="stylesheet" type="text/css" href="css/styles.css"/> 
     </html> 
    ?> 
    </root> 

Luego ajustar el xsl:copy-of instrucción de selección existente para que sea:

<xsl:copy-of select="document('css/styles.css')//processing-instruction()"/> 
Cuestiones relacionadas