let n = 5;
let m = 5;
for(let j=0; j<m; j++){
for(let i=0; i<n; i++){
let boite = document.createElement("p");
boite.innerHTML = i+1;
  
document.querySelector("body").appendChild(boite);
 
}
 
document.write("<br>");
}
body{
  margin: 20px;
  background-color: white;
}
p{
  background-color: black;
  color: white;
  padding: 20px;
  width: 30px;
  border: 2px solid white;
  display: inline-block;
}

Estoy tratando de cambiar el background-color de un párrafo en amarillo cuando el número es par (entonces, en javascript ).

Creo que tengo que escribir una condición como resultado algo así como

document.body.style.backgroundColor = "yellow";

Pero no sé cómo seleccionar el párrafo porque no quiero que cambie el backgroundColor del body

1
Noémie Carette 29 oct. 2017 a las 00:36

4 respuestas

La mejor respuesta

Puede hacerlo utilizando una condición como la siguiente

if((i+1)% 2 == 0){}
let n = 5;
let m = 5;
for(let j=0; j<m; j++){
for(let i=0; i<n; i++){
let boite = document.createElement("p");
boite.innerHTML = i+1;
if((i+1)% 2 == 0){
//voir si i+1 est pair ajouter le couleur
boite.style.backgroundColor = "yellow";
boite.style.color = "#000";
}
document.querySelector("body").appendChild(boite);

 
}
 
document.write("<br>");
}
body{
  margin: 20px;
  background-color: white;
}
p{
  background-color: black;
  color: white;
  padding: 20px;
  width: 30px;
  border: 2px solid white;
  display: inline-block;
}
0
Dharman 27 ene. 2020 a las 01:10

Para cambiar el color de fondo de un párrafo solo use lo siguiente:

<body>
      <p id="paragraphToChange">Hello World!</p>
<script>
    document.getElementById("paragraphToChange").style.background  = "blue";
</script>
</body>
0
Gilbert Cut 28 oct. 2017 a las 21:50

Así es como lo haría:

let docBody = document.querySelector("body");
let n = 6;
let m = 6;
for (let j = 1; j < m; j++) {
  for (let i = 1; i < n; i++) {
    ifEven = (!(i % 2)) ? "style='background-color:yellow;color:#000;'" : "";
    docBody.insertAdjacentHTML("beforeend", "<p " + ifEven + ">" + i + "</p>");
  }
  docBody.children[docBody.children.length - 1].insertAdjacentHTML("afterend", "<br>");
}
body {
  margin: 20px;
  background-color: white;
}

p {
  background-color: black;
  color: white;
  padding: 20px;
  width: 30px;
  border: 2px solid white;
  display: inline-block;
}
0
cssimsek 28 oct. 2017 a las 22:28

Simplemente asigne a cada párrafo una identificación separada, luego obtenga la identificación del elemento y luego cambie su estilo de esta manera: document.getElementById("ID").style.backgroundColor = "yellow";

0
user8083751user8083751 28 oct. 2017 a las 21:43