0

Me interesa saber cómo hacer para tener la función ya cargada al entrar en la página sin tener que dar click en un botón o cargarlo en el body

function color(){
var x = document.getElementById("box");
x.className = "cajas";
}
.cajas{
background-color: #ddd;
display: flex;
justify-content: space-between;
}
.cajas > span{
width: 50px;
height: 50px;
background-color: blue;
display: block;
}
<div id="box">
<span></span>
<span></span>
<span></span>
</div>


<button onclick="color()">Color</button>

1
  • 1
    un bloque <script> con javascript, inmediatamente después de declarado el elemento ya lo puede ver y modificarlo el 23 jul. 2019 a las 0:03

1 respuesta 1

3

Simplemente llamá a la función después de declararla.

function color() {
    var x = document.getElementById("box");
    x.className = "cajas";
}
color();
.cajas{
    background-color: #ddd;
    display: flex;
    justify-content: space-between;
}
.cajas > span{
    width: 50px;
    height: 50px;
    background-color: blue;
    display: block;
}
<div id="box">
<span></span>
<span></span>
<span></span>
</div>

El HTML que recibe el navegador queda así:

<body>
  <div id="box" class="cajas">
    <span></span>
    <span></span>
    <span></span>
  </div>
  <script type="text/javascript">
      function color() {
        var x = document.getElementById("box");
        x.className = "cajas";
      }
      color();
  </script>

  <div class="as-console-wrapper"><div class="as-console"></div></div>
</body>

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.