Problem to attack child and doubt in using this

Question

Problem to attack child and doubt in using this

Navigation

#1 by (2 votes)
#2 by (1 votes)
#3 by (1 votes)

0

I'm having trouble understanding the use of this.

I have the following structure:

<div id="a" class="clsa">
    bbb
</div>

<div id="b" class="clsb">
    <span id="bb" clsbb> Conteudo bb </span>
</div>

I wanted to attack any of the elements at the time of reading it. I'm doing it this way and it's working:

$("#a").ready(function() {
    //Chamando uma função e passando parametros funcionar normalmente, eu queria poder atacar daqui de dentro este mesmo elemento "#a".
})

Now I wanted to be able to get the span of b by following the same idea as the previous one and attacking this span:

$("#b").ready(function() {
    //Chamar o span e atacar ele (fazer alguma coisa, mudar o texto, colocar uma classe)
})

I'm trying this, but it's not rolling. He's calling the document and not this element:

$("#b").ready(function() {
    this.text("teste");
})

I'm using this right?

I'm making the call "$ (" # a "). ready (.." right?

Am I going wrong at some point?

If it were to attack it after the page was loaded, just change the ready to load equal $ (document) .ready and (window) .load?

Help me pf

html jquery

asked by anonymous 04.05.2017 / 08:35

3 answers

1

With Jquery you can use child selector (>) to reach the span of within the div #b.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><script>$("#b").ready(function() {
    $("#b > span").html("teste");
})
</script>

<div id="b" class="clsb">
    <span id="bb"> Conteudo bb </span>
    <br>outra coisa q vai continuar aqui 
</div>

04.05.2017 / 11:23

1

$ ( document ). ready () will not be called. As for the second point that is using this example follows:

$("#b").ready(function() {
    // this nesse caso é o objeto #b
    this.text("teste");
})

The this will always be the object that called the method if you want to use this in the $ ( document ). ready () there is no need to use this way above , example:

$(document).ready(function() {
   $("#bb").text("teste");
})

The use you gave above example, is more in cases of sweeping some list or something similar, example:

// varre todas as divs da página setando nas spans que estão dentro das divs

$("div").each(function()
{
// this nesse caso é a div atual
  $(this).find("span").css("color","red");
})

$("#bb").click(function()
{
// nesse caso o this é a span #bb
$(this).text("teste");
})

04.05.2017 / 16:02

Leave a softer effect Verify existence of file on the web

score 2 · Accepted Answer

When you use this for the element that triggered the event, you will need to use it as a jquery selector:

$("#a").ready(function(){
      $(this).html("Oii");
      //Onde $(this) = $("#a");
});

This rule changes when you are within repetition loops, for example, when $ (this) will reference the element itself in reading:

$("#a").ready(function(){
      $.each($("#minhaUl li"), function(index){
            $(this).html("Oii");
            //Onde $(this) = elemento li em leitura;
      });
});

This means that this has a different value, depending on the execution context.

link

To manipulate the elements inside the event listener, there are a number of ways to do it.

$("#b").ready(function() {
    $("#b > span").html("Oii");
    $("#b span").html("Oii");
    $("#b").find("span").html("Oii"); //$(this).find("span").html("Oii");
    ... //e outras
})

link

But one thing I did not understand is because you're using $(element).ready(...) , because if you just want to assign a value or something, you could use it directly:

$(document).ready(function(){ $("#b").find("span").html("Oii"); ... });