XSLT interrompt le script jQuery/Prototype dans Firefox

Question

Je travaille sur un projet d'école. C'est une page internet avec XML/XSLT. Pour la conception, nous avons pensé à un effet d'évanouissement de l'image en arrière-plan.

Je l'ai fait comme vous pouvez le voir et il fonctionne parfaitement sur IE7. Mais le vérifier dans FF 3.6 lance quelques erreurs suspectes dans firebug et ne fonctionne pas.

Par exemple:

alert($('menu_bg').innerHTML); 

fonctionne lorsqu'il est utilisé avec le document prêt/observer. Mais aucun de ces travaux:

$('#menu_dots').append("content"); // jQuery 
$('menu_dots').insert("content"); // prototype 

Le point est que je ne comprends pas, pourquoi tout fonctionne sans XSLT dans les deux navigateurs. Mais quand je fais la même chose avec XSLT ça casse en FF.

http://nak.erline.eu/index.xml

même domaine /js/_script.js

Je pensais que le problème est basé jQuery, c'est pourquoi j'ai commencé à traduire au prototype. Sur ma moitié chemin j'ai réalisé, que le problème se produit toujours. C'est pourquoi le code est toujours avec jQuery (commenté) et Prototype.

Vous avez une idée?

Answer 1

Si vous devez utiliser XSLT, la fonctionnalité HTML DOM, XML et cross-browser, je peux vous recommander fortement Sarissa. Cela rendra le travail avec le DOM ActiveX dur et incompatible de Microsoft et tous les autres DOM basés sur W3C beaucoup plus facile. Le problème que vous rencontrez (probablement, pas nécessairement) est que les objets DOM résultants n'appartiennent pas aux mêmes documents XML d'origine, ce qui est le comportement DOM par défaut. Par conséquent, jQuery ou Prototype ne peut pas trouver les nouveaux éléments. Une solution consiste à les insérer en tant que texte et les faire réparer, mais c'est coûteux. Il existe d'autres solutions de contournement, mais le plus simple est probablement de regarder Sarissa et d'apprendre à l'utiliser. Ce n'est pas difficile et rend votre code plus lisible. Vous constaterez que Sarissa prend soin de ces derniers et d'autres subtilités afin que vous puissiez vous soucier de choses plus importantes ..

Answer 2

En haut de votre XSLT changement du fichier:

<xsl:output method="xml" indent="yes" 
    doctype-system="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" 
    doctype-public="-//W3C//DTD XHTML 1.0 Transitional//EN" /> 

à

<xsl:output method="html" indent="yes" 
    doctype-system="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" 
    doctype-public="-//W3C//DTD XHTML 1.0 Transitional//EN" /> 

Notez que le type de méthode de sortie doit être html au lieu de xml. Cela a réglé le problème dans mes tests.

Je trouve l'allusion à la réponse ici: Why does my simple strict XHTML file give errors when I include jquery?

également dans mon test, j'ai supprimé les références script suivant

<script src="src/scriptaculous.js" type="text/javascript"/> 
<script type="text/javascript" src="js/_script.js"/> 

et a ajouté une référence à jQuery

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script> 

et testé avec votre extrait de code jQuery.

<script> 
    $(document).ready(function(){ 
     $('#menu_dots').append("content"); 
    }); 
</script>