скрыть содержимое div
добрый вечер.
надеюсь на вашу помощь. ситуация следующая: есть <div id="id_content"> <div id="123"> ... </div> <table class="admin_table" width="100%" cellspacing="2" cellpadding="2"> <table class="light_table" width="100%" cellspacing="0" cellpadding="5" border="1" style="margin-top: 8px;"> </div> как мне скрыть в диве с id=id_content все кроме дива с id=123?:help: :help: :help: к таблицам не могу прописать id,т.к. формирую не я а CMS. можно ли подобраться к таблицам не зная id? |
Цитата:
<style type="text/css">
#id_content > table {
display: none;
}
</style>
<div id="id_content">
<div id="123">
...
</div>
<table class="admin_table" width="100%" cellspacing="2" cellpadding="2">
<td>Test 1</td>
</table>
<table class="light_table" width="100%" cellspacing="0" cellpadding="5" border="1" style="margin-top: 8px;">
<td>Test 2</td>
</table>
</div>
|
так это применится ко всем талблицам в CMS, а мне такого не надо
|
Цитата:
Цитата:
|
так <div id="id_content"> и <table class="admin_table" ...> формирует cms и они везде
|
решил так сделать. под своим <div id="123">...</div> создал незакрывающийся <div id='other' style='display: none;'>
другого выхода я не нашел |
ВНИМАНИЕ РЕШЕНИЕ
function hiide(_selector){
var q = document.querySelectorAll(_selector)
for(var i = 0; i < q.length; i++){
q[i].style.display = 'none'
}
}
function shoow (_selector){
var q = document.querySelectorAll(_selector)
for(var i = 0; i < q.length; i++){
q[i].style.display = ''
}
}
hide ("#id_content:not(#123)") // скрывает
show ("#id_content:not(#123)") // показывает
И ОТВЕТ НА ВОПРОС да к любым элементам можно подбираться не зная не их id не их классов! Для этого существуют селекторы. это именно то что тебе стоит подучить. именно селекторы и передаются в функцию которую я написал и именно они и выбирают элементы. селекторы очень мощные. можно выбрать например все кроме пятого элемента в дочерних элементах нечетных дивов всех спанов с классом не равным 'блаблабла' __________________________________________________ ______________________ |
Цитата:
querySelector, querySelectorAllНо в старых браузерах ее нет, в ИЕ ниже 8-й версии нету. Да и в ИЕ8 она не полноценно работает, хотя простые селекторы обрабатывает |
Цитата:
ну если уж нужна совместимость тогда пусть юзает фреймворки, или я не прав? я же не буду тут распиывать самодельный движок выборки селекторов??? |
Цитата:
|
function hide(){
document.querySelectorAll('#id_content кроме #123 ').className += " hidden" //добавляем класс скрытия
}
function show (){
document.querySelectorAll('#id_content кроме #123 ').className.replace(/\hidden\b/, ' '); //удаляем класс скрытия
}
тока селектор нормальный допишите, это уже с javascript не связано и я в этом на шарю)) по моему там что-то вроде ('#id_content not: #123 ') |
('#id_content:not(#123)')
|
ВНИМАНИЕ РЕШЕНИЕ
function hiide(_selector){
var q = document.querySelectorAll(_selector)
for(var i = 0; i < q.length; i++){
q[i].style.display = 'none'
}
}
function shoow (_selector){
var q = document.querySelectorAll(_selector)
for(var i = 0; i < q.length; i++){
q[i].style.display = ''
}
}
hide ("#id_content:not(#123)") // скрывает
show ("#id_content:not(#123)") // показывает
И ОТВЕТ НА ВОПРОС да к любым элементам можно подбираться не зная не их id не их классов! Для этого существуют селекторы. это именно то что тебе стоит подучить. именно селекторы и передаются в функцию которую я написал и именно они и выбирают элементы. селекторы очень мощные. можно выбрать например все кроме пятого элемента в дочерних элементах нечетных дивов всех спанов с классом не равным 'блаблабла' __________________________________________________ ______________________ |
ну вобще для его случая я допустил ошибку, нужно добавить пробел:
("#id_content :not(#123)")
А вообще querySelectorAll может вернуть null если селектор не верны.. а в ИЕ вообще Exception вылетает и скрипт останавливается... Но для простого понимания да, все чудно. |
Скрыть детей
Цитата:
|
oAlina
Для скольких дивов вызовете функцию, столько и спрячете
<div id='parent1'>
<div>Child 1-1</div>
<div>Child 1-2</div>
<span>hkhkhkh</span>
</div>
<div id='parent2'>
<div>Child 2-1</div>
<div>Child 2-2</div>
<input type='text' value= 'lalala'>
</div>
<div id='parent3'>
<div>Child 3-1</div>
<div>Child 3-2</div>
</div>
<script>
function hideChilds(parentNode) {
var childs = parentNode.childNodes;
for(var i = 0; i < childs.length; i++) {
if(childs[i] != '[object Text]') childs[i].style.display = 'none';
}
}
hideChilds(document.querySelector('#parent1'));
hideChilds(document.querySelector('#parent2'));
</script>
|
| Часовой пояс GMT +3, время: 03:52. |