Skip to main content
1 de 2

Solo cambia el orden del javascript para que no cargue inicialmente.

<!DOCTYPE html>
<html>
    <head>
        <title></title>
        <meta charset="UTF-8">
        <style type="text/css">
            #div1 {
                background-color: cyan; 
                width: 200px; 
                height: 50px;
            } 
            #div2 {
                background-color: yellow; 
                width: 200px; 
                height: 50px;
            }
        </style>
    </head>
    <body>
        <div id="div1" onclick="cambiarColor()">1</div><br>
        <div id="div2" onmouseover="aparecerTexto()" >2</div>
        <script>
            //Poner div de abajo dorado.
            function cambiarColor() {
                var a = document.getElementById('div2');
                //a.style.color='gold';            
                a.style.background ='gold';            
            }
            //Introducir en el div de arriba texto.
            function aparecerTexto() {
                var x = document.getElementById("div1");
                var texto = 'Texto para que se vea en el div de arriba'
                x.innerHTML = texto;
            }
        </script>
    </body>
</html>