Переименование атрибута класса с помощью javascript/jquery

У меня есть старые документы, которые по-прежнему используют атрибуты шрифтов awosome v3.2.1, что все классы имеют имя иконы. Если я использую новую версию, было бы очень неудобно, если бы мне пришлось вручную переименовывать класс один за другим. HTML разметка:Переименование атрибута класса с помощью javascript/jquery

<a class="btn" href="#"><i class="icon-info-sign"></i> Info</a> 
<a class="btn" href="#"><i class="icon-trash"></i> Delete</a> 
<a class="btn" href="#"><i class="icon-cog"></i> Settings</a>

Как результат, как показано ниже

<a class="btn" href="#"><i class="fa fa-info-sign"></i> Info</a> 
<a class="btn" href="#"><i class="fa fa-trash"></i> Delete</a> 
<a class="btn" href="#"><i class="fa fa-cog"></i> Settings</a>

Помощь от кого бы бесценным

источник

2016-08-30 Andes Rizky Nugroho

Можете ли вы показать нам какой-то код, который вы пробовали до сих пор? –

Вы пытались найти и заменить функцию вашего редактора? Я думаю, что поиск «значка» заменить на «fa fa» должен работать. Любой хороший редактор может это сделать. – richb01

Найти и заменить в текстовом редакторе по файлам кажется лучшим решением .... Выполнение этого в браузере - плохая идея, так как вы собираетесь вызвать проблески содержимого. – epascarello

Вы можете заменить классные имена следующим образом:

var icons = document.querySelectorAll('[class^=icon]'); 
 
for (icon of icons){ 
 
    icon.classList.value = icon.classList.value.replace('icon-','fa fa-'); 
 
    console.log(icon.classList.value); 
 
}

<a class="btn" href="#"><i class="icon-info-sign"></i> Info</a> 
 
<a class="btn" href="#"><i class="icon-trash"></i> Delete</a> 
 
<a class="btn" href="#"><i class="icon-cog"></i> Settings</a>

Выберите все элементы, которые имеют имя класса, начиная с "icon"
Для ... петель для итерации каждого значка, и заменить его имя класса с где "icon-" с "fa fa-"
Факультативно console.log

Я бы по-прежнему делал это @ richb01 способом: найти & заменить непосредственно в редакторе кода, намного чище.

источник

2016-08-30 18:17:45 yuriy636

Я только что пробовал и добился успеха @ yuriy636. Это похоже на то, что я ожидал. Спасибо, что помогли дать точный ответ –

в основном вы можете сделать это с помощью метода JQuery switchClass как тот

$("a i").each(function(item){ 
    $(item).switchClass("icon-info-sign", "fa fa-info-sign"); 
    $(item).switchClass("icon-trash" , "fa fa-trash"); 
    $(item).switchClass("icon-cog", "fa fa-cog"); 
}

источник

2016-08-30 18:09:28

Мне по-прежнему требуется написать имя класса один за другим @ ÖzgürErsil, на многих страницах документов мне нужно найти имя класса один за другим заранее –

Переименование атрибута класса с помощью javascript/jquery

ответ

Смежные вопросы