使用JavaScript“ this”作為jquery選擇器

Question

在此代碼中，我們可以獲得元素id的值作為2種不同的方式，並且兩種方式都返回resultat

$("#my_div").on("click", function () {
    alert( $(this).attr("id") );

    alert( this.id );
});

但是我有興趣，第二種方式，在這種情況下是否合適？ 我問這個問題，因為在代碼中我們使用jquery選擇器，對於jquery選擇器，請編寫清晰的javascript： 這是有道理的，它將始終有效嗎？ 還是更好地使用jquery $（this）作為jquery選擇器？ 或沒有差異？

Answer 1

this.id將為您提供內部DOM元素屬性，而$(this).attr("id")返回“ id”屬性的值。

jQuery中this.id的替代方法是使用prop()方法： $(this).prop("id") 。 但是，使用純this.id構造將更加容易和快捷。

Answer 2

jQuery主構造函數可以采用許多不同類型的參數。

在這種情況下， this不是選擇器，而是HTMLElementNode （jQuery將其稱為element ）。

這是完全可以的，並且有文件記錄 。

如果您只是要獲取其ID，則無需花費資源將元素包裝在jQuery對象中。 瀏覽器之間沒有任何兼容性問題。

抓取HTMLElementNode的id屬性需要更少的代碼，並且比將整個東西包裝在jQuery中要快。

Answer 3

是的，您的第二種方法是正確的。

$("#my_div").on("click", function () {
    // this is available within this function
    alert( this.id );
});

this指的是HTMLDOMElement函數中，並將它包裝this內$()會給你一個jQuery對象。

如果您在click處理程序中定義了另一個函數。 例如：

$("#my_div").on("click", function () {
    // keep reference of this
    var that = this;
    function test() {
     // this will not available here directly
     // instead of that you can use reference
     alert(that.id);
    }
});

$(this).attr('id') ， this.id或$(this).prop('id')會得到相同的結果。

Answer 4

選擇最佳方法並不總是很清楚。

在這種情況下，您需要this.id ，因為另一個解決方案需要在后台進行更多調用（對jQuery和attr明顯調用）。

如果您需要更多與瀏覽器不同的信息，可以使用jQuery。