Skip to content
Snippets Groups Projects
Select Git revision
  • 69070404f95a97b09bcb7c9e8f87b60b91481506
  • master default protected
2 results

main.js

Blame
  • Forked from an inaccessible project.
    main.js 3.77 KiB
    /*
    // D. Manipulation des chaînes
    
    // D.2. Créer une constante appelée `nom` et y assigner la chaîne de caractères `Regina`
    const nom = 'Regina';
    // D.3. Créer une constante nommée `url`.
    const url = 'images/'+nom.toLowerCase()+'.jpg';
    // D.4. Créer la variable `html`
    let html = `<a href="${url}">${url}</a>`;
    console.log( html );
    // D.5. Afficher le contenu de la variable `html` dans la page.
    document.querySelector('.pizzasContainer').innerHTML = html;
    // D.6. Modifier encore la variable html avant son affichage
    html = `<a href="${url}">
    	<img src="${url}" />
    	<h4>${nom}</h4>
    </a>`;
    document.querySelector('.pizzasContainer').innerHTML = html;
    
    // E.1. Manipulation des tableaux
    let data = [ 'Regina', 'Napolitaine', 'Spicy' ];
    html = '';
    // E.1. boucle for :
    for (let i = 0; i < data.length; i++) {
    	const nom = data[i],
    		url = `images/${nom.toLowerCase()}.jpg`;
    	html += `<a href="${url}">
    		<img src="${url}" />
    		<h4>${nom}</h4>
    	</a>`;
    }
    document.querySelector('.pizzasContainer').innerHTML = html;
    
    // E.1. Array.forEach :
    html = '';
    data.forEach( nom => {
    	const url = `images/${nom.toLowerCase()}.jpg`;
    	html += `<a href="${url}">
    		<img src="${url}" />
    		<h4>${nom}</h4>
    	</a>`;
    })
    document.querySelector('.pizzasContainer').innerHTML = html;
    
    // E.1. Array.map + Array.join :
    html = data.map( nom => `<a href="images/${nom.toLowerCase()}.jpg">
    <img src="images/${nom.toLowerCase()}.jpg" />
    <h4>${nom}</h4>
    </a>`).join('');
    document.querySelector('.pizzasContainer').innerHTML = html;
    
    // E.1. Array.reduce :
    html = data.reduce( (str, nom) => str+`<a href="images/${nom.toLowerCase()}.jpg">
    	<img src="images/${nom.toLowerCase()}.jpg" />
    	<h4>${nom}</h4>
    </a>`,'');
    document.querySelector('.pizzasContainer').innerHTML = html;
    */
    
    // E.2. Les objets littéraux
    const data = [
    	{
    		nom: 'Regina',
    		base: 'tomate',
    		prix_petite: 6.5,
    		prix_grande: 9.95,
    		image: 'https://images.unsplash.com/photo-1532246420286-127bcd803104?fit=crop&w=500&h=300'
    	},
    	{
    		nom: 'Napolitaine',