Проблемы с className
Доброго времени суток.
Имеется 4 блока div c разными id и разными class. Задача:поменять у одного из блоков div один класс на другой. Логику как это сделать я вроде понял,но вот как это выразить в коде непонимаю. Гугление особых результатов не принесло,поэтому если можно поясните мне на примере,приведенном ниже, как в коде обратиться к определенному div по его классу(как записать,что хочу к div class=olo1 добавить class=olo4,а следом удалить из него class=olo1)(место выделено как комментарий). <!DOCTYPE html>
<html>
<head>
<title>Заголовок страницы</title>
<meta charset="utf-8">
<style>
#did1
#did2
#did3
#did4
#olo{color:white;}
.olo1 {background:red; width: 100px; height: 100px;}
.olo2 {background:green; width: 100px; height: 100px;}
.olo3 {background:blue; width: 100px; height: 100px;}
.olo4 {background:pink; width: 100px; height: 100px;}
</style>
<script>
window.onload = function ()
{
document.getElementById('did1').//className(' olo1 ') = ' olo4 '
document.getElementById('did1').//className(' olo1 ').replace = ' olo1 '
}
</script>
</head>
<body>
<center>
<div id=did1 class=' olo1 '>one</div>
<div id=did2 class=' olo2 '>two</div>
<div id=did3 class=' olo3 '>three</div>
<div id=did4 class=' olo4 '>four</div>
</center>
</body>
</html>
|
Цитата:
|
Исправил,но вопрос остался тот же.
|
Цитата:
$('.olo1').addClass('olo4').removeClass('olo1')
неужели прочитать любой один мануал по jquery это так сложно? |
А без jquery это сделать можно?Прочитать не сложно,но мне тут надо обойтись пока без него.
|
mta88, а кто Вам сказал, что автор использует jQuery? :)
|
Цитата:
в самой jquery методы 'addClass' и 'removeClass' реализованы через манипуляцию 'className' с помощью методов строк 'replace' и 'indexOf' посмотрите сами, там больше 3 строчек https://github.com/jquery/jquery/blo...ributes.js#L27 ------------------------------------ P.S. да и вы сами пытались replace использовать вроде, но не получилось изучите нормально javascript и все получится не мне же вас ветвлениям и работе со строками учить |
HTMLElement.prototype.addClass = function(a)
{
this.className += ' '+a;
}
HTMLElement.prototype.removeClass = function(a)
{
var b = new RegExp(' ?'+a);
this.className = this.className.replace(b, '');
}
document.getElementById('did1').addClass('test');
document.getElementById('did2').removeClass('test');
|
document.getElementById('did1').classList.add('test');
document.getElementById('did1').classList.remove('test');
Для IE 8 подключаем костыль. |
Появился новый вопрос, есть ли возможность удалить вообще ВСЕ классы,не перечисляя их.
Имею ввиду что то на подобии этого: document.getElementById('did1').classList.remove('*');
|
| Часовой пояс GMT +3, время: 20:16. |