Element
Les portions importantes sont mises en exergue.
$('elt1_4').show(); alert('Cliquer OK pour continuer.'); ['elt1_1', 'elt1_3'].each(Element.hide); alert('Cliquer OK pour continuer.'); ['elt1_2', 'elt1_3'].each(Element.toggle); alert($('elt1_2').visible());
// Représentation HTML du conteneur d'éléments ci-dessous alert('HTML depuis le DOM :\n' + $('elements2').innerHTML); $('elements2').cleanWhitespace(); alert('HTML depuis le DOM :\n' + $('elements2').innerHTML); alert('elt2_3 vide : ' + ($('elt2_3').empty() ? 'oui' : 'non')); $('elt2_3').update('\n\t\t \n'); alert('elt2_3 vide : ' + ($('elt2_3').empty() ? 'oui' : 'non')); try { $('elt2_2').remove(); alert('Tiens ! Plus d\'élément 2...'); } catch (e) { alert('Erreur : ' + e); } $('elt2_4').replace('<div class="element fourth" id="elt2_4">ELT2_4 !</div>');
var elt2 = $('elt3_2'); if (!elt2.hasClassName('hilite')) { elt2.addClassName('hilite'); alert('Classe "hilite" ajoutée.'); } elt2.removeClassName('second'); // Quand je vous disais que les itérateurs prennent l'index en // dernier argument... var cNames = elt2.classNames().map(function(name, index) { return (index + 1) + '. ' + name; }); alert('Classes pour elt3_2 :\n' + cNames.join('\n')); // Affichera 400 ou normal, valeur calculée obtenue par héritage de la propriété // font-weight: normal (équiv. 400) sur le div conteneur des éléments) alert('Graisse de elt3_3 : ' + $('elt3_3').getStyle('font-weight')); $('elt3_4').setStyle({ fontVariant: 'small-caps', background: 'maroon', color: 'white' });
alert($('elt4_1').getHeight()); var dims = $('elt4_3').getDimensions(); alert(dims.width + ' × ' + dims.height); with ($('elt4_2')) { style.left = '-72px'; alert('Ça n\'a rien fait. Essayons en positionné...'); makePositioned(); style.left = '-72px'; alert('Oui, mais maintenant on n\'y voit plus rien. Annulons...'); undoPositioned(); }
Note : la troncature ne fonctionne pas correctement sur Konqueror.
alert('Repartons en début de page...'); $('title').scrollTo(); alert('Et maintenant, revenons à nos moutons.'); $('code5').scrollTo(); alert('Tentons maintenant de restreindre cet affichage de code...'); $('code5').setStyle({ width: '30ex', border: '1px solid gray', background: '#eee' }); alert('C\'est pas le succès fou... Et en clipping ?'); $('code5').makeClipping(); alert('Aaaah. Mais il serait temps d\'y revoir quelque chose.'); $('code5').undoClipping(); alert('Et virons ces styles bizarroïdes.'); $('code5').setStyle({ width: '', border: '', background: '' });