Как заменить имя класса 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');