Как настроить это CSS объекты с JavaScript?

Question

Как настроить это CSS объекты с JavaScript?

0

У меня такое ощущение, что это довольно просто, но мой JS не очень хорош.

У меня есть div-класс

<div class=" foo1 foo2" style="top: 0px;">

Я могу видеть в chrome, что у этого div есть атрибут, подобный этому:

.foo2
{
    position: fixed;
    width: 100%;
}

Я пытаюсь использовать JS для настройки атрибутов foo2, но я не знаю, как это сделать.

var changeFoo = document.getElementById ('foo2');
changeFoo.position = "relative";

Как мне вызвать foo2.position и изменить его?

Scuba Steve 07 нояб. 2013, в 04:43

Источник

3

Это класс, а не идентификатор ... Смотрите здесь developer.mozilla.org/en-US/docs/Web/API/…
elclanrs 07 нояб. 2013, в 03:09
2

Используйте коллекцию .style : foo2.style.position = 'relative'; , См. Developer.mozilla.org/en-US/docs/Web/API/HTMLElement.style
pete 07 нояб. 2013, в 03:09
0

Я использовал стиль, но у div есть style = "top: 0px;" параметр, поэтому, когда я пытаюсь изменить стиль, он изменяет element.style, но не .foo2.position
Scuba Steve 07 нояб. 2013, в 03:30

Показать ещё 1 комментарий

Теги:

javascript

html

css

4 ответа

Ещё вопросы

Это класс, а не идентификатор ... Смотрите здесь developer.mozilla.org/en-US/docs/Web/API/…
Используйте коллекцию .style : foo2.style.position = 'relative'; , См. Developer.mozilla.org/en-US/docs/Web/API/HTMLElement.style
Я использовал стиль, но у div есть style = "top: 0px;" параметр, поэтому, когда я пытаюсь изменить стиль, он изменяет element.style, но не .foo2.position

suresh.g · Answer 1 · 2013-11-07T01-59-00.000Z

Попробуй это:

Это чистое решение для JavaScript.

function update_this_css(matchClass) {
    var elems = document.getElementsByTagName('*'), i;
    for (i in elems) {
        if((' ' + elems[i].className + ' ').indexOf(' ' + matchClass + ' ')
                > -1) {
            elems[i].style.position = "relative";
        }
    }
}

update_this_css('foo2');

Harvey · Answer 2 · 2013-11-07T01-43-00.000Z

Вы пытаетесь заставить JS идентифицировать элемент, используя свой ID ('foo2'), который вы не установили. Если вы хотите использовать имя класса, вы должны использовать:

document.getElementsByClassName

иначе вы должны указать вашему элементу свой желаемый идентификатор.

Другая проблема заключается в том, что вы просто имеете:

changeFoo.position

где, как вам нужно использовать:

changeFoo.style.position

Чтобы заставить ваш код работать, вам необходимо просмотреть результаты:

var divs = document.getElementsByClassName('foo');
for(var i=0; i<divs.length; i++) { 
divs[i].style.position='fixed'
}

Vicky Gonsalves · Answer 3 · 2013-11-07T01-34-00.000Z

Вы можете сделать это как:

var foo= document.getElementsByClassName('foo2');   
for(var i=0;i<foo.length;i++){  
foo[i].style.position='relative';  
}

Alexus · Answer 4 · 2013-11-07T00-37-00.000Z

Самый простой способ, который я нашел до сих пор, - использовать jQuery, потому что обычный javascript намного длиннее и сложнее писать. Получите JS-библиотеку на jquery.com. Изучите jQuery один раз и скажите спасибо себе навсегда. Вы можете использовать селектор CSS для получения элементов без каких-либо идентификаторов.

Затем используйте его так.

$('.foo2').css('position', 'relative');

http://api.jquery.com/css/