無法向jQuery中的鏈接添加屬性？

Question

這是我網頁上各種鏈接的格式。鏈接可以是任何這些類型的：

<a data-id="1444709976-ohgusB" data-toggle="modal" class="modal-link store-link" 
    href="http://firstwebsite.com/some-text.html" 
    data-target="#myModal"> 
    BOLDR Voyage watch may just be the 「clever」 device you want and need</a> 

<a data-id="1443322807-iLmF2d" class="store-link" 
    href="http://secondwebsite.com/other-text.html" target="_blank"> 
    Gmail for Android: 7 cool tips and tricks you must try<span class="fa fa-external-link"></span></a> 

我試着用以下的jQuery更改只有.store-link類中的所有鏈接的屬性。這是我的代碼：

if($('a.store-link').hasClass('modal-link')==false){ 
    $(this).removeAttr('target'); 
    $(this).addClass('modal-link'); 
    $(this).attr('data-toggle','modal'); 
    $(this).attr('data-target','#myModal'); 
} 

但是，任何鏈接的屬性都沒有變化。我也沒有得到任何錯誤。

Answer 1

當您使用每次都會a.store鏈路上環，它會工作， 在你的代碼中有一些錯誤，如$(this)，我想你認爲它是指$("a.store-link")但它不是

$('a.store-link').each(function() 
{ 
    if($(this).hasClass('modal-link') == false) 
    { 
     $(this).removeAttr('target'); 
     $(this).addClass('modal-link'); 
     $(this).attr('data-toggle','modal'); 
     $(this).attr('data-target','#myModal'); 
    } 
}); 

Answer 2

作爲@ Diptox答案的解釋，我添加了這個答案。

如果您沒有設置this對象的功能空間，它會指向全局對象（即window對象），除非你調用一個函數，並設置它的this被攝體或文本對象調用一個函數。

在下面的例子中，編寫了多種用法this。

var foo = /* some object */; 

function bar(){ 
    console.log(this); 
} 

var obj = { 
    someMethod: function(){ 
     console.log(this); 
    } 
} 

console.log(this); // this = Global Object i.e. window 
bar();    // this = Global Object i.e. window 
bar.call(foo);  // this = foo 
obj.someMethod(); // this = obj 

---

你的情況：

if($('a.store-link').hasClass('modal-link')==false){ 
    $(this).removeAttr('target'); 
    $(this).addClass('modal-link'); 
    $(this).attr('data-toggle','modal'); 
    $(this).attr('data-target','#myModal'); 
} 

其實this指向全局對象（即window）。在@ Diptox的回答中：

$('a.store-link').each(function() 
{ 

    /* In this function space, 'this' is set by jQuery,   */ 
    /* which points to the current object of type 'a.store-link' */ 

    if($(this).hasClass('modal-link') == false) 
    { 
     $(this).removeAttr('target'); 
     $(this).addClass('modal-link'); 
     $(this).attr('data-toggle','modal'); 
     $(this).attr('data-target','#myModal'); 
    } 
});