[SOLUCIONADO] querySelector()

[joelcollell]

Buenas tardes,
Os dejo un codigo sacado de un libro, no me funciona i creo que se el porque.

codigo:
var logo
function iniciar(){
logo=document.querySelector('#CabeceraPágina img');
logo.addEventListener('click',cambio)
function cambio(){
logo.style.border='15px solid black';
}
}
addEventListener('load',iniciar)

Simplemente saber si se puede utilizar querySelector() con id + elemento html.
la solucion que he encontrado es la de dar una classe a la imagen i llamar directamente la classe pero lo veo poco efectivo. Si alguno tiene alguna otra solucion mas efectiva o distinta estoi abierto a propuestas.
muchas gracias.

[PHPeros]

Selectores CSS

[jsstoni]

CabeceraPágina supongo que por el acento amigo

[joelcollell]

<header id="CabeceraPagina" class="sombra">
<hgroup>
<h1 class="h1a">La música como terapia</h1>
<h2 class="h2a">para el cuerpo y el alma</h2>
</hgroup>
<img src="Imagenes/logo.jpg" alt="Firma de Contxita Bentz con teclado de fondo">
</header>

os dejo parte del html,

#CabeceraPagina h1{
font-size:350%;
text-align:center;
line-height:0%;
font-variant:small-caps;
}

#CabeceraPagina h2{
font-size:250%;
text-align:center;
line-height:0%;
}

#CabeceraPagina{
overflow:hidden;
background:-webkit-linear-gradient(top, #99CC00, #99CC99 30%);
}

header:not(#CabeceraPagina){
background-color:rgba(255,255,255,0.8 );
}

i parte del css, aver si os lo puedo poner mas facil para poder buscar la solucion,
he cambiado el tema de los accentos i nada,
muchas gracias,

[GeekGirl]

Por supuesto que podés utilizar el query selector de la manera que decís. Tu problema radica en que pusiste un acento de llamar por el id, y el id no tiene ese acento (igualmente no pongas acentos en los id!).

Esta así:

Código Javascript:

logo=document.querySelector('#CabeceraPágina img')
 

Debería ser:

Código Javascript:

logo=document.querySelector('#CabeceraPagina img')
 

Saludos

[joelcollell]

al decirme jsstoni lo de los accentos los cambie todos, ahora CabeceraPagina del js esta sin accento.
Aun asi sigue sin hacer nada....
me esta sacando de quicio.
gracias,
Se que me explico mal, lo siento empiezo aora a utilizar foros, tengo qe aprender.

[GeekGirl]

Lamento, no había leído su comentario. Y qué es load? Por qué no asignas directamente una función al elemento?

Código Javascript:

var logo = document.querySelector('#CabeceraPagina img');
 
logo.onclick = function() {
    logo.style.border='15px solid black';
}
 

[joelcollell]

load es para decirle que haga la función cuando acabe de cargar la pagina es parecido al click, eso debe funcionar, lo havia utilizado en un par de ejercicios antes. te puedes creer que ni el codigo que me has dado me funciona, no entiendo nada.... bueno voi a passar a otra cosa que esto me tiene atascado hace demasiado tiempo... ire mirando de vez en cuando aver si alguien me ilumina ;) muchissimas gracias x todo i sobre todo x vuestra atencion.

[GeekGirl]

En qué navegador y versión estás probando el código? Revisaste la tabla de compatibilidades para querySelector()? Ante la desesperación de no poder resolverlo, probá agregando un id a la imagen y llamando al elemento con ese id.

Código HTML:

<img src="Imagenes/logo.jpg" id="logo" alt="Firma de Contxita Bentz con teclado de fondo" />
<script type="text/javascript">
    var logo = document.getElementById("logo");
         
          logo.onclick = function() {
              logo.style.border='15px solid black';
          }
</script> 

Si con eso funciona, es un problema de compatibilidad con querySelector(). Yo lo probé en un par de browsers y el código que te pasé funciona.

Saludos y suerte :)

[joelcollell]

será eso lo mas seguro,
lo que me dices lo he probado i me funciona, i utilizando una classe para la imagen tamb funciona, pero no lo veo util.

Código Javascript:

var logo = document.querySelector('#CabeceraPagina .img');
 
logo.onclick = function() {
    logo.style.border='15px solid black';
}
 

[joelcollell]

por cierto utilizo el google chrome 40.0.2214.115 , cual crees qe es el mas comveniente de utilizar para este tema? paginas web en general

[GeekGirl]

No deberías tener problemas con esa versión tan reciente de Chrome. Es raro :/

[joelcollell]

Ni idea, ya llevo un par de clases sin tocar el libro, lo tengo cruzado. muchísimas gracias por todo.