В чем разница между «$ (это)» и «это»?

$() - это функция-конструктор jQuery.

this ссылка на элемент вызова DOM.

Итак, в основном, в $(this) вы просто передаете this в $() в качестве параметра, чтобы вы могли вызывать методы и функции jQuery.

Да, вам нужно $(this) для jQuery-функций, но если вы хотите получить доступ к базовым javascript-методам элемента, который не использует jQuery, вы можете просто использовать this.

При использовании jQuery рекомендуется использовать $(this) обычно. Но если вы знаете (вы должны узнать и знать) разницу, иногда удобнее и быстрее использовать только this. Например:

$(".myCheckboxes").change(function(){ 
    if(this.checked) 
       alert("checked"); 
});

проще и чище, чем

$(".myCheckboxes").change(function(){ 
      if($(this).is(":checked")) 
         alert("checked"); 
});

this - это элемент, $(this) - объект jQuery, построенный с этим элементом

$(".class").each(function(){
 //the iterations current html element 
 //the classic JavaScript API is exposed here (such as .innerHTML and .appendChild)
 var HTMLElement = this;

 //the current HTML element is passed to the jQuery constructor
 //the jQuery API is exposed here (such as .html() and .append())
 var jQueryObject = $(this);
});

Более глубокий внешний вид

this ^MDN содержится в контексте выполнения

Сфера действия относится к текущему Контексту выполнения ^ECMA. Чтобы понять this, важно понять, как контексты выполнения работают в JavaScript.

контексты выполнения связывают это

Когда элемент управления входит в контекст выполнения (в этой области выполняется код), среда для переменных настраивается (Лексическая и переменная среды - по существу это создает область для ввода переменных, которые уже были доступны, и область для локальных переменные, которые необходимо сохранить), и происходит привязка this.

jQuery связывает этот

Контексты выполнения образуют логический стек. В результате контексты, более глубокие в стеке, имеют доступ к предыдущим переменным, но их привязки могут быть изменены. Каждый раз, когда jQuery вызывает функцию обратного вызова, он изменяет эту привязку, используя apply ^MDN..

callback.apply( obj[ i ] )//where obj[i] is the current element

Результатом вызова apply является то, что внутри функций обратного вызова jQuery, this ссылается на текущий элемент, используемый функцией обратного вызова.

Например, в .each обычно используется функция обратного вызова .each(function(index,element){/*scope*/}). В этой области, this == element является истинным.

Обратные вызовы jQuery используют функцию apply для привязки вызываемой функции к текущему элементу. Этот элемент исходит из массива элементов объекта jQuery. Каждый построенный объект jQuery содержит массив элементов, которые соответствуют селектору ^{jQuery API}, который использовался для создания экземпляра jQuery объект.

$(selector) вызывает функцию jQuery (помните, что $ является ссылкой на jQuery, code: window.jQuery = window.$ = jQuery;). Внутренне функция jQuery создает объект функции. Поэтому, хотя это может быть не сразу очевидным, использование $() внутренне использует new jQuery(). Часть конструкции этого объекта jQuery состоит в том, чтобы найти все совпадения селектора. Конструктор также примет html строки и элементы. Когда вы передаете this в конструктор jQuery, вы передаете текущий элемент для объекта jQuery, который будет создан с помощью. Затем объект jQuery содержит массив-подобную структуру элементов DOM, соответствующих селектору (или только одному элементу в случае this).

Как только объект jQuery будет создан, теперь будет открыт API jQuery. Когда вызывается функция jQuery api, она будет внутренне перебирать эту массивную структуру. Для каждого элемента массива он вызывает функцию обратного вызова для api, привязывая обратный вызов this к текущему элементу. Этот вызов можно увидеть в фрагменте кода выше, где obj - структура, подобная массиву, и i - это итератор, используемый для позиции в массиве текущего элемента.

Да, используя $(this), вы включили функцию jQuery для объекта. Просто используя this, он имеет только общие функции Javascript.

этот ссылается на объект javascript и $(this), используемый для инкапсуляции с помощью jQuery.

Пример = >

// Getting Name and modify css property of dom object through jQuery
var name = $(this).attr('name');
$(this).css('background-color','white')

// Getting form object and its data and work on..
this = document.getElementsByName("new_photo")[0]
formData = new FormData(this)

// Calling blur method on find input field with help of both as below
$(this).find('input[type=text]')[0].blur()

//Above is equivalent to
this = $(this).find('input[type=text]')[0]
this.blur()

//Find value of a text field with id "index-number"
this = document.getElementById("index-number");
this.value

or 

this = $('#index-number');
$(this).val(); // Equivalent to $('#index-number').val()
$(this).css('color','#000000')