name - jquery atributo id

¿Cómo puedo cambiar los nombres de los atributos HTML con jQuery?

Question

Me gustaría cambiar todos los nombres de los atributos donde class="testingCase" en todo mi documento html completo.

por ejemplo, cambio:

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

A esto:

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

Estaba pensando en encontrar y reemplazar, pero parece que hay un montón de código para algo tan fácil. ¿Hay una función jQuery para esto o un método simple?

Answer 1

No creo que pueda "cambiar el nombre" de un atributo, pero puede crear nuevos atributos y eliminar otros ...

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

Editar: agregado en el bit que hace que solo seleccione a elemento con class="testingCase"

Answer 2

No creo que puedas cambiar el nombre de un atributo, pero lo que puedes hacer es:

• obtener todas las etiquetas <a> con un atributo de título;
• para todos ellos, cree un nuevo atributo Title con el mismo valor que el título;
• luego borra el atributo de título.

JQuery te permite hacer eso con funciones integradas de esta manera:

/* 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

Aquí hay un plugin de estilo jquery que le da un método renameAttr:

// 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)
;
};

También hay este ejemplo que agrega una opción para eliminar los datos del antiguo atributo.

Answer 4

Un poco más tarde, pero este enlace tiene una gran extensión de función jquery:

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-'','''') );
      }
    });
  }
});

Ejemplo

// $(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 );

NO ESCRIBÍ ESTO. PERO HICE LA PRUEBA ES CON JQ 1.10. EL CÓDIGO ES DEL ENLACE.

Answer 5

Un trazador de líneas

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

funcionó muy bien para mí cuando necesité quitar un prefijo de todos mis atributos

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