заменить класс CSS при загрузке страницы

0

Я хочу заменить
div class= "rich fomat2 type-a" с
div class= "standard format1 type-a"

Но я могу только изменить html, когда он загружается, потому что я использую веб-сайт, создающий программное обеспечение, которое автоматически выводит html. Поэтому я использовал функцию onload().

Я пробовал.attr(), а также.getElementsByClassName(), но не работал. Где я иду не так? Любая помощь?

    function onload() {$('div') .attr('rich format2 type-a', ' standard format1 type-a') ; } window.onload =onload; }            
window.onload = onload;

    function onload(){
var els = [].slice.apply(document.getElementsByClassName("rich format2 type-a"));
for (var i = 0; i < els.length; i++) {
els[i].className = els[i].className.replace(/ *\brich format2 type-a\b/g, "standard format1 type-a");
} window.onload = onload;
  • 1
    Вы не можете иметь пробелы в именах атрибутов.
  • 0
    .attr() является функцией jQuery, и, если вы хотите изменить классы, .removeClass() и .addClass() , вероятно, лучше подходят, если вы уже используете jQuery.
Показать ещё 2 комментария
Теги:

4 ответа

1

у вас будет div с классом

<div class="abc"></div>

В jQuery вы можете сделать следующее

$('.abc').removeClass('abc').addClass('newClass');

Допустим, ваш div выглядит так

<div class="a b c"></div>

Это на самом деле означает, что вы div содержат 3 разных класса. И поэтому нужно так называть.

$('.a.b.c').removeClass('a').removeClass('b').removeClass('c').addClass('newClass');

Надеюсь, поможет. Jonas

Поделиться
  • 0
    Вы можете удалить несколько классов одним оператором: removeClass('ab c') .
  • 0
    Я знаю об этом. Это было просто для иллюстрации того, что пробелы в параметре class = "" равны 3 различным классам, а не одному.
0

Если я понимаю ваш вопрос, вот мое решение. Цените свое время.

$('div').removeClass('a b c').addClass('d e f');

Вот скрипка

Поделиться
0

Проверьте jQuery toggleClass - https://api.jquery.com/toggleClass/

jQuery(function($){
  $("div")
      .toggleClass('a b c');
      .toggleClass('d e f');
});
Поделиться
0

1. Использование .attr()

Эта функция используется для получения/установки атрибута.

Первое поле - это имя атрибута, необязательным вторым является новое значение.

$("div").attr("class", "def");

Обратите внимание, что имя атрибута является классом, поэтому первое значение поля - "класс".

Поскольку вы хотите выбрать только .abc, которые имеют класс .abc, поместите это в селектор:

$("div.abc").attr("class", "def");

2. Синтаксис класса

Другая серьезная ошибка, присутствующая в вашем коде, отмеченная @adeneo, заключается в том, что классы не могут иметь пробелов в них.

class="abc" означает "Использовать классы .a,.b, and.c "

Из-за этого, .getElementsByClassName() не работает.

Если это предназначено, вы можете использовать комбинированный селектор классов:

$("div.a.b.c").attr("class", "def");
Поделиться

Ещё вопросы

Сообщество Overcoder
Наверх
Меню