Manipuler un site existant

Exemples

function manipulation ( selection, index = 0, delai = 250 ) {

   selection[ index ].style.transform = 'rotate(' + ( index * 10 ) + 'deg)';

   if ( index < selection.length - 1 ) {
      window.setTimeout( function () {
         manipulation( selection, index + 1 );
      }, delai );
   }
}

var images = document.body.querySelectorAll('img');
manipulation( images );

---

function manipulation ( selection, index = 0, delai = 250 ) {

   selection[ index ].style.position = 'relative';
   selection[ index ].style.top = ( Math.round( Math.random() * 10 - 5 ) ) + 'px';
   selection[ index ].style.left = ( Math.round( Math.random() * 10 - 5 ) ) + 'px';

   if ( index < selection.length - 1 ) {
      window.setTimeout( function () {
         manipulation( selection, index + 1 );
      }, delai );
   }
}

var paragraphes = document.body.querySelectorAll('p');
manipulation( paragraphes );

---

var selection = document.body.querySelectorAll('a');

for (var i = 0; i < selection.length; i++) {
   selection[i].addEventListener( 'mouseover', interaction );
}

function interaction ( evenement ) {
   evenement.target.style.display = 'none';
}

---

var selection = document.body.querySelectorAll('a');

for (var i = 0; i < selection.length; i++) {
   selection[i].addEventListener( 'mouseover', interaction );
}

function interaction ( evenement ) {
   evenement.target.setAttribute( 'href', '#' );
   evenement.target.innerHTML = '💔';
}

---

Exercice

En vous aidant des exemples précédents, proposez un script qui modifie une page web existante (s’il s’agit d’une page web particulière, le préciser).