Como atua o THIS na função index() do jQuery?

[DiogoJefferson 0]

Olá,

 

Primeiramente, meu objetivo é encontrar o índice do parágrafo que eu clico. Para isso, uso duas diferentes formas.

 

Por padrão, tenho a seguinte marcação HTML:

 

<button type="button" class="reset">Reset</button>

<br />

<b>Clique em cada um dos parágrafos abaixo para revelar seu índice</b>

<p>Parágrafo um.</p>

<p>Parágrafo dois.</p>

<p>Parágrafo três.</p>

OBS.: o cursor dos parágrafos estão com o valor "pointer".

Ao clicar em um parágrafo, a seguinte função é executada:

<script type="text/javascript">

$(document).ready(function() {

$('p').click(function() {

var indice = $(this).index();

alert('O índice deste parágrafo é:' + indice + '<br />');

});

$('.reset').click(function() {

$('div').empty();

});

});

</script>

 

Ao clicar no primeiro parágrafo, o índice devolvido é 3. Ou seja, o script considera todos os elementos que vem antes do elemento-alvo e traz a posição de acordo com a ordem de marcação do meu documento: '<button>'(0), '<br />'(1), '<b>'(2), '<p>'(3).

 

Entretanto, se eu modificar a função para esta forma:

 

<script type="text/javascript">

$(document).ready(function() {

$('p').click(function() {

var indice = $('p').index(this);

alert('O índice deste parágrafo é:' + indice + '<br />');

});

$('.reset').click(function() {

$('div').empty();

});

});

</script>

... e clicar no primeiro parágrafo, a função considera apenas a ordem dos parágrafos da página e diz que o seu índice é 0.

Então garela, na primeira forma o script considera todos os elementos, já na segunda, apenas os elementos parágrafos são considerados. Acontece que eu não entendi o porque disso. Por isso venho aqui pedir uma help.

Desde já muito obrigado! ;)

[William Bruno 1501]

Segundo a documentação:

https://api.jquery.com/index/

 

É exatamente isso que você percebeu.

A segunda considera só os parágrafos, pq quando você passa o this, você está perguntando:

 

Pegue esses elementos $('p') e me diga qual o índice do this dentro deles.

[DiogoJefferson 0]

Olá Bruno,

 

Obrigado por tirar a dúvida! Simples e objetivo! Ficou bem claro agora!

 

Valeeuu cara! :)