Как изменить параметр класса с помощью JS?
Все перерыл, так и не смог ничего найти.
Есть такой кусок: <head>
<style>
.class1 {
position: absolute
}
</style>
<script>
document.getElementById('class1').style.position = relative
</script>
</head>
<body>
<div class="class1">1</div>
<div class="class1">2</div>
</body>
В общем, скрипт должен менять параметр класса. getElementById работает только с идентификатором, а мне нужно с классом. |
Используйте getElementsByClassName, но это не кроссбраузерный метод, используйте эту реализацию.
<head>
<style>
.class1 {
position: absolute
}
</style>
<script>
window.onload = function(){
document.getElementsByClassName('class1')[0].style.position = 'relative';
}
</script>
</head>
<body>
<div class="class1">1</div>
<div class="class1">2</div>
</body>
|
Спасибо! Мне это нужно для всего кроме Эксплорера.
Только к ней еще нужно цикл прикрутить, чтобы все элементы по очереди перебирала. А как узнать кол-во элементов? Не очень понял смысл getElementsByClass(). Что она выдает, список найденных элементов? В каком виде? |
Возвращает массив найденных элементов. Вот пример всё пояснит:
<head>
<style>
.class1 {
position: absolute
}
</style>
<script>
window.onload = function(){
var elems = document.getElementsByClassName('class1');
for(i=0; i < elems.length; i++) {
elems[i].style.position = 'relative';
elems[i].innerHTML = 'Индекс:' + i;
}
}
</script>
</head>
<body>
<div class="class1">1</div>
<div class="class1">2</div>
</body>
|
Я в принципе сделал цикл так:
for (i = 0; (document.getElementsByClassName('class1')[i] != undefined); i++) {
document.getElementsByClassName('class1')[i].style.position = 'relative';
}
Это нормально или слишком по рабоче-крестьянски? |
Shitbox2, зачем так то?
в крайнем случае если вам нужна проверка на undefined: var elems = document.getElementsByClassName('class1');
for (i = 0; i < elems.length; i++) {
if (elems[i] != undefined) {
elems[i].style.position = 'relative';
elems[i].innerHTML = 'Индекс:' + i;
}
}
|
| Часовой пояс GMT +3, время: 18:52. |