Передача HTML и CSS в Javascript

Question

Мне нужно найти способ передать видимый div в javascript. Возможно, это даже не лучший способ выполнить то, что я пытаюсь сделать, поэтому я открыт для других предложений.

Все содержимое моего сайта открывается в одном наложении. При нажатии кнопки в навигации этот контент открывается в оверлее. При нажатии другой кнопки этот контент заменяет текущий контент в оверлее. И так далее.

Лучший идентификатор (который я заметил), из которого открыто наложение, это (CSS) display:block ...
, и все скрытые элементы div display:none ....

Итак, я хочу передать, какой div имеет display:block в javascript (Примечание: все div имеют уникальные идентификаторы)

Я уверен, что это что-то легкое, но я не могу найти это ...

Заранее спасибо за ваше время !!

Answer 1

Каждый элемент HTML в JS имеет свойство style.Вы можете прочитать и изменить стиль элемента, позвонив, например,

document.getElementById('id').style.display

Так что вам не нужно ничего передавать в JS, он уже там.

Answer 2

Читая ваш вопрос, звучит так, как будто вам нужно определить, какой из ваших дивов является видимым.Самый простой способ сделать это - добавить класс ко всем вашим элементам div с контентом. Затем вы можете использовать document.getElementsByClassName(), чтобы получить их список, и просмотреть, какой из них является видимым, на основе свойства display, равного * 1003.*.

<div class="content" style="display: none";>a</div>
<div class="content" style="display: block;">b</div>
<div class="content" style="display: none";>c</div>
<div class="content" style="display: none";>d</div>
<div class="content" style="display: none";>e</div>

var elements = document.getElementsByClassName("content");

for(i = 0; i < elements.length; i++) 
{
     if (elements[i].style.display == 'block')
     {
          // elements[i] = this is the visable div 
          alert('This elements[i] has a display of block; contents =  ' + elements[i].innerText);  
     }
}

Приведенный выше скрипт выдаст / alert 'b', поскольку это видимый найденный div. Скриптовая ссылка