Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 25.07.2021, 17:54
Кандидат Javascript-наук
Отправить личное сообщение для WebMachine Посмотреть профиль Найти все сообщения от WebMachine
 
Регистрация: 11.10.2016
Сообщений: 141

Скрытие ссылок при отсутствии блоков
Есть меню:
<a href="#" class="one">
<a href="#" class="two">
<a href="#" class="three">

Есть блоки:
<div class="one">содержимое</div>
<div class="two">содержимое</div>
<div class="three">содержимое</div>

Как сделать так чтобы если нет "блока" - скрывалась ссылка
Но чтобы это происходило за счёт проверки id между ссылкой и блоком.

Спасибо вам за помощь) от всей души ребят. Добра вам

Последний раз редактировалось WebMachine, 26.07.2021 в 00:40.
Ответить с цитированием
  #2 (permalink)  
Старый 25.07.2021, 18:42
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,121

WebMachine, ИД должно быть уникальным на странице...
Ответить с цитированием
  #3 (permalink)  
Старый 26.07.2021, 00:39
Кандидат Javascript-наук
Отправить личное сообщение для WebMachine Посмотреть профиль Найти все сообщения от WebMachine
 
Регистрация: 11.10.2016
Сообщений: 141

Сообщение от ksa Посмотреть сообщение
WebMachine, ИД должно быть уникальным на странице...
А как в другом случае можно это осуществить? Мне подойдёт любой вариант главное чтобы ссылки отображались только если есть такая новость (блок) например по классам..
Ответить с цитированием
  #4 (permalink)  
Старый 26.07.2021, 06:52
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,068

WebMachine,
<!DOCTYPE html>

<html>
<head>
    <title>Untitled</title>
    <meta charset="utf-8">
    <style type="text/css">
    a.hide{
        display: none;
    }

    </style>

    <script>
document.addEventListener( "DOMContentLoaded" , function() {
["one", "two", "three"].forEach(cls => document.querySelector(`a.${cls}`).classList.toggle("hide", !document.querySelector(`div.${cls}`)))
  });
    </script>
</head>

<body>
<a href="#" class="one">one</a>
<a href="#" class="two">two</a>
<a href="#" class="three">three</a>
<br>
Есть блоки:
<div class="one">содержимое one</div>
<div class="three">содержимое three</div>

</body>
</html>
Ответить с цитированием
  #5 (permalink)  
Старый 26.07.2021, 13:13
Кандидат Javascript-наук
Отправить личное сообщение для WebMachine Посмотреть профиль Найти все сообщения от WebMachine
 
Регистрация: 11.10.2016
Сообщений: 141

Рони. Огромное спасибо вам
Ответить с цитированием
  #6 (permalink)  
Старый 26.07.2021, 15:02
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,068

Янковиц,
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Замена контента страницы при переходе с разных ссылок antipersperant Общие вопросы Javascript 2 20.05.2020 09:14
Изменение блоков при нажатии Georgie0409 (X)HTML/CSS 6 08.12.2019 14:12
Ппереключение блоков при наведение на другие блоки misha.korolcov Элементы интерфейса 0 08.10.2019 17:13
анимация блоков при клике Dmitriy154 Общие вопросы Javascript 0 03.01.2017 13:48
Скрытие резиновых блоков в зависимости от разрешения + листалка shtab Работа 2 08.06.2010 15:18