Форум

Shitbox2 · #1 (**permalink**) 07.03.2011, 19:36

Все перерыл, так и не смог ничего найти.

Есть такой кусок:

<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 работает только с идентификатором, а мне нужно с классом.

Vulkan · #2 (**permalink**) 07.03.2011, 19:43

Используйте 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>

Shitbox2 · #3 (**permalink**) 07.03.2011, 19:56

Спасибо! Мне это нужно для всего кроме Эксплорера.

Только к ней еще нужно цикл прикрутить, чтобы все элементы по очереди перебирала. А как узнать кол-во элементов?

Не очень понял смысл getElementsByClass(). Что она выдает, список найденных элементов? В каком виде?

Vulkan · #4 (**permalink**) 07.03.2011, 20:16

Возвращает массив найденных элементов. Вот пример всё пояснит:

<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>

Shitbox2 · #5 (**permalink**) 07.03.2011, 20:25

Я в принципе сделал цикл так:

for (i = 0; (document.getElementsByClassName('class1')[i] != undefined); i++) {
				document.getElementsByClassName('class1')[i].style.position = 'relative';
			}

Это нормально или слишком по рабоче-крестьянски?

Vulkan · #6 (**permalink**) 07.03.2011, 20:52

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;
    }
}

Форум

Справочник

Discord чат

Курсы javascript