Как заменить имя класса HTML на javascript

ok, поэтому я пытаюсь получить элемент с именем класса "no-js" и заменить его на "js", поэтому у меня нет идеи, как это сделать, я попробовал google. Но cann найти что-нибудь, так кто-нибудь теперь, как это сделать?

то, что я пытаюсь сделать Это меню, когда вы нажимаете кнопку "Плюс", имеет это выпадающее меню, но если javascript отключен, я хочу, чтобы он показывался при наведении css (я уже это сделал)

Я положил мой код на JsFiddle, heres ссылку: http://jsfiddle.net/MrPumpkin22/v9dcC/10/

спасибо.

Ответы

Ответ 1

Вам нужно выполнить итерацию возвращаемых элементов и заменить эту часть имени класса на каждом из них:

var els = [].slice.apply(document.getElementsByClassName("no-js"));
for (var i = 0; i < els.length; i++) {
    els[i].className = els[i].className.replace(/ *\bno-js\b/g, "js");
}

Обратите внимание, что getElementsByClassName возвращает "живой список", поэтому необходимо сначала сделать копию возвращаемого значения (используя [].slice) и переименовать этот список).

Ответ 2

javascript вы можете изменить имя класса, используя

document.getElementById('elementid').className = 'classname'

если вы хотите добавить новый класс с помощью javascript

document.getElementById('elementid').className += ' classname'

Если вы хотите заменить имя класса другими вещами, используйте строки, замените функцию

document.getElementById('elementid').className = document.getElementById('elementid').className.replace(your replace code)

Ответ 3

выглядят как вопрос, но, кажется, это предпочтительный способ сделать это...

(function(html){html.className = 
   html.className.replace(/\bno-js\b/,'js')})(document.documentElement);

Пример:

<!DOCTYPE html>
<html lang="en-US" class="no-js">
<head itemscope itemtype="http://schema.org/WebSite">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="profile" href="http://gmpg.org/xfn/11">
    <script>(function(html){html.className = html.className.replace(/\bno-js\b/,'js')})(document.documentElement);</script>
    <title>Example Site| My Site Description</title>

Обратите внимание на расположение этого раннего места на головке документа... Это гарантирует, что он будет немедленно добавлен. Это гораздо более быстрый подход, чем альтернатива jquery. Я считаю, что это делает модернизация.

Ответ 4

Не указано ли имя метода getElementsByClassName, что он должен возвращать не один элемент, а несколько элементов? Потому что в документе может быть много элементов с одним и тем же классом. более внимательно прочитайте документы.

Если вы знакомы с CSS, существует метод document.querySelectorAll, который извлекает элементы с помощью селекторов CSS.

var plusLinks = document.querySelectorAll('a.no-js')

Затем вы можете получить доступ к отдельным ссылкам по их числовому индексу:

var firstLink = plusLinks[0]

Что касается атрибута class (и это атрибут class, а не атрибут no-js), вы не должны его удалять, но set это новое значение.

firstLink.setAttribute('class', 'js')

Или:

firstLink.className = 'js'

Поскольку вы хотите удалить эффект наведения, а элемент body уже имеет класс no-js, вы можете заменить класс один раз для всей страницы:

document.body.className = 'js'

Ответ 5

Шаг 1 - получить элемент по его уникальному идентификатору -

Element = Document.GetElementByID("whatever");

Шаг 2 - удалите класс атрибута -

Element.RemoveAttribute("class");

Шаг 3 - создать класс атрибута -

    var attribute = document.createAttribute("class");
    attribute.nodeValue = "someclassnamehere"
    Element.setAttributeNode(attribute);

Ответ 6

В Javascript вы можете сделать это, выполнив следующие действия:

document.getElementById('id').add('class');
document.getElementById('id').remove('class');