Meaning of 'this' inside jQuery code

Question

I am reading an excellent book about jQuery (Apress Pro jQuery) and I am a little confused about the use of 'this'. For example I am reading the following code :

<script type="text/javascript">
$(document).ready(function() {
 var isResult = $('img').is(function(index) {
 return this.getAttribute("src") == "rose.png";
 });
 console.log("Result: " + isResult);
 });
</script>

I am wondering at which object in this case 'this' refers to. Thank you.

• Ryan: It's reffering to the selector $('img')
• Brian Glaz: If you want to check it out, you can always open up a console and do console.log(this) to see what it's referring to.
• Jack: @RPM, 'this' is not referencing the jQuery object $('img'), it is referencing the DOM element.
• Selvakumar Arumugam: @BrianGlaz Unless you have break point inside that function, console.log(this) would return window object.
• Brian Glaz: @Vega I meant 'open up a console' so you can view the result. I didn't mean to execute that code from the console. It should be inside the function, of course. Sorry if that wasn't clear.

Answer 1

this in the "this" context is a reference to the DOM img element.

• Sam Tyson: it's actually the set of objects referred to by the selector, which may contain 0 or more img elements.
• gen_Eric: @SamTyson: Actually, the function is ran for each <img> element, so this the individual <img> element.
• skiabox: @SamTyson : Great answer too, the console.log(this) that I used inside the function returned six elements with one of them only with src="rose.png" attribute so the final result of the second console command is true!
• skiabox: As the book says is(function(index)) --> Returns true if the function returns true at least once.