如何"这个“;在jQuery中工作

How "this" works in jQuery

本文关键字：jQuery 工作 这个 quot 如何      更新时间：2023-09-26

有人能解释一下"this"在jQuery中是如何工作的吗。我试着在网上找一些信息，但因为"this"在他通常的意思中用得很多，我找不到什么好的。

我希望能够在不给每个列表元素id的情况下更改列表元素（<li>）的背景。

$('li').on('click.namespace', function() {
   console.log(this);    /* this is a reference to the DOM 
                            element you clicked */
   console.log($(this)); /* this is a jQuery reference to the 
                            DOM element you clicked */
   /* using jQuery reference you can change the background in this way */
   $(this).css('background-image', 'url(...)');


});

$("li").click(function() {
   $(this).css("background-color", "red");
});

下面是一个例子。$(this)表示JQuery对象，this表示单击的常规DOM对象。

您找到click（）文档了吗？它显示了您应该如何使用单击处理程序，它甚至有使用$(this)的示例。

这里有一个例子：

$('li').click(function() {
  $(this).attr("class", "clicked");
});

当单击某个项目时，this会获取所单击项目的值，即DOM元素。$(this)允许您访问jquery API。

如果在li上设置onclick事件，则可以使用$（this）来获取li的jquery对象，然后添加一个类，例如$（this）.addClass（"newBackground"）.

jQuery可以将函数的上下文设置为您感兴趣的内容。在这种情况下，有问题的<li>。但是this仍然是一个裸露的DOM元素，您需要用$()包装它才能在它上使用jQuery方法 
$('li').on('click', function() {
    $(this).css({background:'red'});
});

有时您必须使用绑定函数（请参阅jQuery.proxy()）作为事件处理程序，在这些情况下，您可以以不同的方式访问当前元素，而不是使用this，您可以使用event.currentTarget属性，请参阅http://api.jquery.com/event.currentTarget/

相关文章：