Je veux traduire ce code jquery: $('#zone').prepend('<p><strong>' + login + '</strong> ' + message + '</p>');

J'ai essayé ça: document.getElementById('zone').innerHTML = '<p><strong>' + login + '</strong> ' + message + '</p>';

Mais le problème est que je ne sais pas où je peux mettre ".prepend". Merci de votre aide

1
igachi 5 avril 2020 à 21:57

3 réponses

Meilleure réponse

Si vous voulez vous en tenir à innerHTML, vous pouvez simplement le faire:

const zone = document.getElementById('zone');
zone.innerHTML = '<p><strong>' + login + '</strong> ' + message + '</p>' + zone.innerHTML;

Une autre idée est d'utiliser un élément dynamique et d'éviter de réécrire votre #zone HTML (c'est important lorsque vous avez des choses comme des entrées, car le premier exemple les effacera):

const p = document.createElement('p');
const strong = document.createElement('strong');
strong.textContent = login;
p.append(strong, ' ' + message);
document.getElementById('zone').prepend(p);
1
Robo Robok 5 avril 2020 à 19:04

Vous pouvez utiliser la Node#firstChild propriété et Node#inserBefore, elle a donc gagné 'recrée pas les éléments enfants existants.

// create the `p` tag and set its HTML content
const p = document.createElemnt('p');
p.innerHTML = '<strong>' + login + '</strong> ' + message ;

const ele = document.getElementById('zone');
// insert the created p tag element before the first element
ele.insertBefore(p, ele.firstChild) ;
1
Pranav C Balan 5 avril 2020 à 19:14

Vous devez l'ajouter au début de la chaîne comme suit:

var zone = document.getElementById('zone');
const content = zone.innerHTML;
zone.innerHTML = `<p><strong>${login}</strong>${message}</p>` + content;
1
Majed Badawi 5 avril 2020 à 19:08