| |
|
|
| | Мне надо произвести изменения с тегами определенного класса.
Необходимо при нажатии мышкой(лев и прав) сделать теги определенного класса невидимыми.
Я хочу, что-бы эти изменения с тегами, вызывались в JavaScript.
Какая должна быть инструкция в JavaScript, что-бы обратится к определенному классу тегов.
(допустим в тегах class=div_mess)
Можно ли обратится к классам тегов по аналогии с идентификатором тегов?
Например
<a href=# onclick="div1.style.visibility ='visible'; >открыть</a>
<div id=div1 style="position:fixed; visibility:hidden;" >открыто</div>
|
Спасибо. | |
| |
|
|
| |
|
|
| |
для: Сашинька
(15.08.2011 в 10:53)
| | | Можно начать отталкиваться от следующего скрипта
<html>
<script>
function hide_div_mess() {
var arr = document.getElementsByClassName('div_mess');
for(var i = 0; i < arr.length; i++) {
arr[i].style.display = 'none';
}
retrun false;
}
</script>
<body>
<div><a href="#" onclick='hide_div_mess()'>ссылка</a></div>
<div class="div_mess">Будет скрыто</div>
<div>Не будет скрыто</div>
<div class="div_mess">Будет скрыто</div>
<div class="div_mess">Будет скрыто</div>
<div class="div_mess">Будет скрыто</div>
<div class="div_mess">Будет скрыто</div>
<div class="div_mess">Будет скрыто</div>
</body>
</html>
|
| |
| |
|
|
| |
|
|
| |
для: cheops
(15.08.2011 в 11:35)
| | | Извините, не успел точно формализировать мысль, ваш ответ опередил
....-+
Можно ли обратится к классам тегов без getElementsByClassName по аналогии с идентификатором тегов( без getElementsByTagName)?
Например
<a href=# onclick="div1.style.visibility ='visible'; >открыть</a>
<div id=div1 style="visibility:hidden;" >открыто</div>
|
Мне надо что-бы один блок открывался, другие блоки закрывались (например это вкладки).
Спасибо. | |
| |
|
|
| |
|
|
| |
для: Сашинька
(15.08.2011 в 11:40)
| | | Пока не понятно... класс по опредлению принадлежит сразу нескольким элементам, идентификатор может принадлежать только одному элементу. Поэтому в первом случае мы имеем дело с массивом и функцией getElementsByClassName(), во втором getElementById(). В приведенном выше примере, вы вместо .style.display = 'none', можете использовать style.visibility ='visible'; или style.visibility ='hidden';. Если дело не в этом, нужно больше подробностей, что требуется. | |
| |
|
|
| |
|
|
| |
для: cheops
(15.08.2011 в 11:45)
| | | Основная моя задача:
Мне надо что-бы при клике один блок div открывался и становился видимым, другие блоки div закрывались и становились не видимыми (например это вкладки).
1. Если есть у вас готовый, хочется посмотреть на готовый, например для двух блоков div
2. В решении задачи хотелось бы найти вариант (на будущее, для разных случаев в жизни),
когда упростив код javascript и расположив его в теге, можно было бы обратится к классу тегов(нескольким тегам). Нельзя ли отказаться от циклов? | |
| |
|
|
| |
|
|
| |
для: Сашинька
(15.08.2011 в 11:53)
| | | Без разметки такой блок может выглядеть следующим образом
<html>
<script>
function hide_div_mess(id) {
// Всех скрываем
var arr = document.getElementsByClassName('div_mess');
for(var i = 0; i < arr.length; i++) {
arr[i].style.display = 'none';
}
// Отображаем выбранный
document.getElementById("id" + id).style.display = 'block';
}
</script>
<body>
<div><a href="#" onclick='hide_div_mess(1)'>ссылка 1</a></div>
<div><a href="#" onclick='hide_div_mess(2)'>ссылка 2</a></div>
<div><a href="#" onclick='hide_div_mess(3)'>ссылка 3</a></div>
<div><a href="#" onclick='hide_div_mess(4)'>ссылка 4</a></div>
<div id='id1' style='display:none' class="div_mess">Первая вкладка</div>
<div id='id2' style='display:none' class="div_mess">Вторая вкладка</div>
<div id='id3' style='display:none' class="div_mess">Третья вкладка</div>
<div id='id4' style='display:none' class="div_mess">Четвертая вкладка</div>
</body>
</html>
|
| |
| |
|
|
| |
|
|
| |
для: cheops
(15.08.2011 в 12:00)
| | | Спасибо
2. В решении задачи хотелось бы найти вариант (на будущее, для разных случаев в жизни),
когда упростив код javascript и расположив его в теге, можно было бы обратится к классу тегов(нескольким тегам). Нельзя ли отказаться от циклов?
или(и)
3. Если (для универсальности) ввести вызове функции параметр имени класса, то как-то через this или иначе это можно сделать?
| |
| |
|
|
| |
|
|
| |
для: Сашинька
(15.08.2011 в 12:09)
| | | 2. Циклы все-равно где-то должны быть, вы можете использовать свою библиотеку или библиотеку вроде jQuery или плагин для jQuery, где циклы упрятаны внутрь, однако, сами циклы все-равно где-то должны быть. Проще всего разработать отдельную функцию, которая по имени класса скрывает все объекты с таким классом... более того, такой класс вы можете предварительно добавить при помощи JavaScript... но как-то все-равно нужно выделить те div-тэги, которыми мы будем манипулировать.
3. Можно, однако, в самой ссылке должно быть достаточно информации, чтобы произвести манипуляции над нужным тэгом.
PS Вы знакомились с jQuery? Вот более универсального решения добиться сложно - т.е. можно привязаться к HTML-тэгам, их последовательности, атрибутам id, классам, но их все-равно придется указывать, хоть jQuery-коду, хоть коду на чистом JavaScript. | |
| |
|
|
| |
|
|
| |
для: cheops
(15.08.2011 в 12:18)
| | | Чепуха у меня получилась. В программировании везде и всюду изобретение велосипедов.
При решении своей задачи хотелось уйти от jQuery. На этот шаг толкнула простота идеи.
<div id=div1 onclick="div1.style.visibility ='hidden;" >скрыть</div>
|
Казалось так же, что добавив короткую инструкцию в строчку тега, можно несколько тегов закрыть.
Начало для меня было заманчивым и обнадеживающим, а в результате пришли к тому, от чего хотелось уйти- jQuery.
Наверное можно так сказать:
"Надо брать готовый фреймворк и там разбираться и не искать путей оптимизации или укорачивания кода. "[Знать бы где упадешь, подстелил бы]
Спасибо. | |
| |
|
|
| |
|
|
| |
для: Сашинька
(15.08.2011 в 12:37)
| | | Можно и на чистом JavaScript все делать - получится довольно компактно и элегантно, однако, уровень понимания DOM, JavaScript и его заморочек нужен довольно высокий. jQuery делали далеко не дураки и бешенную популярность он приобрел не спроста (уж если Microsoft его в Visual Studio включила, вместо того, чтобы что-то свое разработать...). Более того, сам JavaScript применительно к HTML проще понять сначала изучив jQuery... Быстрее получится.
Вообще говоря JavaScript - это урезанный функциональный язык, который решает чисто функциональные задачи в очень грязных условиях (DOM отличается от браузера к браузеру). Это вообще говоря довольно ядреная смесь и подход jQuery - он более разумный и более подходящий для этого класса задач. Более того, jQeury заставляет функциональные задачи решать в функциональном стиле, поэтому все получается просто и элегантно, JavaScript изначально должен так выглядеть, его просто императивщики разрабатывали, причем довольно стихийно, а потом опять же императивщики начали его эксплуатировать... императивные языки для таких задач плохо подходят, а парочка идей из функционального программирования в необычном синтаксисе добивает ситуацию - язык труднопонимаемый и сложноиспользуемый (учитывая, что нужно разбираться в разметке). Фактически, чтобы получалось компактно и надежно - нужно разарабатывать свою библиотеку или пользоваться готовой. jQuery - это очень хорошее решение в плане интерфейса и абстракции, удручает только её вес: дурак-браузер, весящий 20Мб находится у клиента, а jQuery приходится таскать с каждого второго сайта. | |
| |
|
|
| |
|
|
| |
для: cheops
(15.08.2011 в 15:00)
| | | Хорошо, будем делать как скажете, на jQuery | |
| |
|
|
| |
|
|
| |
для: Сашинька
(15.08.2011 в 11:40)
| | | >Мне надо что-бы один блок открывался, другие блоки закрывались (например это вкладки).
Хм... ну тогда скрывайте все, как описано выше, а потом отображайте ту вкладку, которая выбрана. | |
| |
|
|
