Как применить стиль сразу к нескольким id в javascript?

Question

[Xrist1An]

Как применить стиль сразу к нескольким id в javascript? Я пробовал так:

document.getElementById("#id1 #id2 #id3").style.display="none";

Потом пробовал так:

document.getElementById("#id1, #id2, #id3").style.display="none";

И еще много как, но ничего не работает. Что я делаю не так?

Answer 1

[Александр Сизинцев]

А чего не добавить общий class к элементам и изменять параметры этого класса?

Будет и короче код, а если у тебя на странице будет 100 таких элементов? так же писать будешь?

Comments

[Xrist1An]

Мудрый совет, спасибо :)

[Александр Сизинцев]

Xrist1An: не за что

Answer 2

[Владимир Т.]

document.querySelectorAll("#id1, #id2, #id3")

Comments

[Xrist1An]

Не работает

[Владимир Т.]

Xrist1An: нужно перебирать все элементы в выборке и задавать style каждому. Но решение Александр Сизинцев лучше конечно.

Answer 3

[Almik Эх! Дайте мне гитару]

document.getElementById() - принимает только один аргумент, и возвращает соответствующий DOM объект. Вот поэтому твой метод не работает. Либо подключи JQuery и напиши примерно следующее:
Это код на jquery

var t = $('#red , #blue, #black');

$.each(t, function(number,item){
    $(item).addClass("st"+number);
});

Это код на CSS

p.st1{color:red;font-size:40px;};
p.st2{color:blue};
p.st3{color:black};

Это код HTML

<p id='red'>aAAAAAa</p>
<span>1111111111</span>
<p id='blue'>aAAAAAa</p>
<b>22222222222222222</b>
<p id='black'>aAAAAAa</p>

Answer 4

[Глюкъ Виртуален]

Id не для стилизации. Используйте class.

Answer 5

[Дмитрий]

Вообще да, id не для стилизации, привязывать стили к id просто не допустимо. Но если уж нужно к нескольким id применить какие-то действия, например присвоить какой-то класс, то можно создать объект из перечни нужных id, и в отдельном методе их обработать с помощью цикла. Что-то типа такого:

var my_obj.elems = {
    id_1: document.getElementById('test_id_1'),
    id_2: document.getElementById('test_id_2'),
    id_3: document.getElementById('test_id_3')
};

my_obj.setClass = function() {
    //   перебираем каждый элемент в объекте и выполняем какие-то действия с ним
    for(var i in var my_obj.elems) {
        var my_obj.elems[i].className = 'my_class';
    }
};

my_obj.setClass();

Ни в коем случае не нужно употреблять "style", максимально избегай такой дряни в хтмл как
<div style="text-align:center;"></div>

Comments

[Дмитрий]

Дополню, я эту ф-цию написал с лету, в идеале ее в таком виде пускать нельзя ни в коем случае! Это просто пример направления, куда можно (нужно) мыслить.

Answer 6

[keslo]

Может использовать селекторы на JQuery?

Comments

[Xrist1An]

Как?

[Виталий Уткин]

Xrist1An: $('#id1, #id2, #id3').css('display', 'none');

[Xrist1An]

Виталий Уткин: Теперь работает. Спасибо!

[Виталий Уткин]

Xrist1An: Пожалуйста :) Для изучения jquery очень рекомендую jquery.page2page.ru