Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
240 views
in Technique[技术] by (71.8m points)

jQuery $(this) selector function and limitations

I need help understanding $(this). Is it possible to narrow the focus of "this" within the parentheses or does "this" preclude the use of any other attributes?

For example: I don't understand why this code:

$(this).children("div")

can't be rewritten like this:

$(this + " div")

without having to resort to something like:

$('#'+$(this).attr("id")+ " div")

Also, can you point me to 'this' in the jQuery documentation? It is difficult to use 'this' as a search term for obvious reasons.

See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Reply

0 votes
by (71.8m points)

this isn't a jQuery "thing", but a basic JavaScript one. It can't be re-written the way you have in examples because it's an object, in particular either a DOM element or a jQuery object (depending on what context you're in). So if you did this:

 $(this + " div")

What you'd really be doing is calling .toString() on this to concatenate the strings, resulting in:

 $("[object Object] div")

....which isn't a valid selector.

As for further reading, I believe this article continues to be one of the best references/resources to learn what this (a context keyword) means.


Per comment requests, some examples of what this is in various places:

  • Event handlers, for example: $("selector").click(function() { alert(this); });
    • this refers to the DOM element the event handler is being triggered on.
  • Inside a jQuery plugin, for example: $.fn.myPlugin = function() { alert(this); });
    • this is the jQuery object the plugin was called/chained on, for example: $("selector").myPlugin();, this is that $("selector") jQuery object.
  • Inside any generic function, for example: function myFunc() { alert(this); };
    • this is the context you're in, whether it be an object or something else, a few examples:
    • $("selector").click(myFunc); - this is the DOM element, like above
    • $("selector").click(function() { myFunc(); }); - this is the global content, window
    • myFunc.call(whatThisIs, arg1, arg2); - this is whatThisIs

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
OGeek|极客中国-欢迎来到极客的世界,一个免费开放的程序员编程交流平台!开放,进步,分享!让技术改变生活,让极客改变未来! Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...