Wie kann ich HTML-Attributnamen mit jQuery ändern?

Question

Ich möchte alle Namen der Attribute, wo class="testingCase" in meinem gesamten HTML-Dokument.

z.B. Wechsel:

<a class="testingCase" href="#" title="name of testing case">Blabla</a> 
<a class="testingCase" href="#" title="name of another testing case">Bloo</a> 

Um dies:

<a class="testingCase" href="#" newTitleName="name of testing case">Blabla</a>` 
<a class="testingCase" href="#" newTitleName="name of another testing case">Bloo</a>` 

Ich wurde von einem Fund zu denken und ersetzen, aber das scheint eine Menge Code für etwas so einfach. Gibt es eine jQuery-Funktion für diese oder eine einfache Methode?

Answer 1

Ich glaube nicht, können Sie „umbenennen“ ein Attribut, aber Sie können neue Attribute erstellen und andere, die entfernen ...

$('a.testingCase[title]').each(function() { 
    var $t = $(this); 
    $t 
     .attr({ 
      newTitleName : $t.attr('title'), 
     }) 
     .removeAttr('title') 
    ; 
}); 

Edit: in der Bit hinzugefügt, die es nur a Elemente auswählen macht mit class="testingCase"

Answer 2

ich glaube nicht, dass Sie einen Attributnamen ändern können, aber was kann man tun, ist:

• erhalten alle <a> Schlüssel ein Titelattribut;
• Für jede von ihnen, erstellen Sie ein NewTitleName-Attribut mit dem gleichen Wert wie der Titel;
• dann löschen Sie das Titelattribut.

JQuery können Sie tun, mit eingebauten Funktionen auf diese Weise:

/* get all <a> with a "title" attribute that are testingCase 
then apply an anonymous function on each of them */ 

$('a.testingCase[title]').each(function() { 

    /* create a jquery object from the <a> DOM object */ 
    var $a_with_title = $(this);  

    /* add the new attribute with the title value */ 
    $a_with_title.attr("newTitleName", $a_with_title.getAttribute('title')); 

    /* remove the old attribute */ 
    $a_with_title.removeAttr('title'); 

}); 

Answer 3

Hier ist eine einfache jquery-Stil-Plugin, das Ihnen eine renameAttr Methode gibt:

// Rename an entity attribute 
jQuery.fn.renameAttr = function(oldName, newName) { 
    var args = arguments[0] || {}; 
    var o = $(this[0]) 

     o 
     .attr(
      newName, o.attr(oldName) 
     ) 
     .removeAttr(oldName) 
     ; 
}; 

Es ist auch this example die Fügt eine Option hinzu, um die Daten für das alte Attribut zu entfernen.

Answer 4

Wenig später aber link hat eine große jquery Funktionserweiterung:

jQuery.fn.extend({ 
  renameAttr: function(name, newName, removeData) { 
    var val; 
    return this.each(function() { 
      val = jQuery.attr(this, name); 
      jQuery.attr(this, newName, val); 
      jQuery.removeAttr(this, name); 
      // remove original data 
      if (removeData !== false){ 
        jQuery.removeData(this, name.replace('data-','')); 
      } 
    }); 
  } 
}); 

Beispiel

// $(selector).renameAttr(original-attr, new-attr, removeData); 
  
// removeData flag is true by default 
$('#test').renameAttr('data-test', 'data-new'); 
  
// removeData flag set to false will not remove the 
// .data("test") value 
$('#test').renameAttr('data-test', 'data-new', false); 

habe ich nicht schreiben. ABER ICH TEST IST MIT JQ 1.10. Der Code ist von der LINK.

Answer 5

One-Liner

$('selector').replaceWith($('selector')[0].outerHTML.replace("oldName=","newName=")); 

arbeitete großartig für mich, wenn ich einen Präfix von allen meinen Eigenschaften strippen benötigt

$('selector').replaceWith($('selector')[0].outerHTML.(/prefix\-/g,""));