Qual o erro do script? :s

15/04/2016

Boa noite pessoal, sou novo na �rea de java script e estou querendo fazer um script que pegue o valor "Hello World." da tag <div> pela sua class="example" e alerte Hello World, mas quando executo o c�digo recebo [Object HTMLCollection] como resposta, onde est� meu erro?

<!DOCTYPE html>
<html>
<body>

<div class="example">Hello World.</div>

<button onclick="myFunction()">Try it</button>

<script>
function myFunction() {
    var x = document.getElementsByClassName("example");
    window.alert(x);
}
</script>

</body>
</html>

Foxtery

Curtir t�pico + 0

Responder

Posts

15/04/2016

Raylan Zibel

<!DOCTYPE html>
<html>
<body>
<div class="example" id="example">Hello World.</div>
<button onclick="myFunction()">Try it</button>
<script>
function myFunction() {
    //var x = document.getElementsByClassName("example");
    var x = document.getElementById("example");
    window.alert(x.innerText);
}
</script> 
</body>
</html>

Precisa ser pelo nome da classe?

Responder

Gostei + 0

15/04/2016

Foxtery

Vaaleu, funcionou, mas est� obtendo pela id, seria poss�vel obter pela class?

Responder

Gostei + 0

15/04/2016

Raylan Zibel

Implemente jQuery, vai ficar bem mais f�cil. Com jQuery fica f�cil referenciar pelas classes.

Responder

Gostei + 0

15/04/2016

Foxtery

Onde estou errando?

<!DOCTYPE html>
<html>
<head>
	<title></title>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
<div class="example">Hello World.</div>
<button onclick="myFunction()">Try it</button>
<script>
function myFunction() {
	var x = $( ".example" );
    window.alert(x.innerText);
}
</script> 
</body>
</html>

Responder

Gostei + 0

15/04/2016

Raylan Zibel

<!DOCTYPE html>
<html>
<head>
    <title></title>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
<div class="example">Hello World.</div>
<button onclick="myFunction()">Try it</button>
<script>
function myFunction() {
    var x = $( ".example" );
    window.alert(x.html()); // aqui
}
</script> 
</body>
</html>

Responder

Gostei + 0

15/04/2016

Foxtery

Obrigado Raylan, voc� � fera mesmo!

Responder

Gostei + 0