Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 22.07.2020, 14:56
Кандидат Javascript-наук
Отправить личное сообщение для Lefseq Посмотреть профиль Найти все сообщения от Lefseq
 
Регистрация: 19.04.2019
Сообщений: 124

Как кликом по ссылке скрыть ее, а на ее месте вызвать div блок?
Здравствуйте. Помогите, пожалуйста решить небольшую задачу. Нужно чтобы при клике на обычную ссылку (без перехода на страницу) эта ссылка исчезала, а на ее месте появлялся див блок. Как это сделать?
Ответить с цитированием
  #2 (permalink)  
Старый 22.07.2020, 16:14
Профессор
Отправить личное сообщение для Nexus Посмотреть профиль Найти все сообщения от Nexus
 
Регистрация: 04.12.2012
Сообщений: 3,795

<a href="https://google.com/">Click me</a>

<script>
document.querySelector('a').addEventListener('click', function(e) {
    e.preventDefault();

    const div = document.createElement('div');
    div.innerHTML = 'div';

    this.outerHTML = div.outerHTML;
});
</script>


Или так (более предпочтительнее):
<a href="https://google.com/">Click me</a>

<script>
document.querySelector('a').addEventListener('click', function(e) {
    e.preventDefault();

    const div = document.createElement('div');
    div.innerHTML = 'div';
    
    this.parentNode.insertBefore(div, this);
    this.parentNode.removeChild(this);
});
</script>

Последний раз редактировалось Nexus, 22.07.2020 в 16:16.
Ответить с цитированием
  #3 (permalink)  
Старый 22.07.2020, 20:05
Кандидат Javascript-наук
Отправить личное сообщение для Lefseq Посмотреть профиль Найти все сообщения от Lefseq
 
Регистрация: 19.04.2019
Сообщений: 124

Nexus,
Спасибо большое!
Ответить с цитированием
  #4 (permalink)  
Старый 23.07.2020, 07:29
Кандидат Javascript-наук
Отправить личное сообщение для Lefseq Посмотреть профиль Найти все сообщения от Lefseq
 
Регистрация: 19.04.2019
Сообщений: 124

Nexus,
Сразу не заметил, но получается, так, что это работает только для одной ссылке (для одного клика). А если на странице несколько ссылок, как сделать, так, чтобы кликая по нескольким ссылкам скрывать их и выводить div блоки?
Ответить с цитированием
  #5 (permalink)  
Старый 23.07.2020, 13:32
Профессор
Отправить личное сообщение для Nexus Посмотреть профиль Найти все сообщения от Nexus
 
Регистрация: 04.12.2012
Сообщений: 3,795

Используйте:
https://developer.mozilla.org/ru/doc...erySelectorAll
Ответить с цитированием
  #6 (permalink)  
Старый 23.07.2020, 14:09
Новичок на форуме
Отправить личное сообщение для slawkanikitin Посмотреть профиль Найти все сообщения от slawkanikitin
 
Регистрация: 23.07.2020
Сообщений: 1

Спасибо большое, как я давно это искал!
Ответить с цитированием
  #7 (permalink)  
Старый 23.07.2020, 19:36
Кандидат Javascript-наук
Отправить личное сообщение для Lefseq Посмотреть профиль Найти все сообщения от Lefseq
 
Регистрация: 19.04.2019
Сообщений: 124

Nexus,
Я не понимаю, что мне с этим делать? Вы бы не могли конкретно показать, что и где нужно прописать?
Ответить с цитированием
  #8 (permalink)  
Старый 23.07.2020, 21:29
Профессор
Отправить личное сообщение для Nexus Посмотреть профиль Найти все сообщения от Nexus
 
Регистрация: 04.12.2012
Сообщений: 3,795

Lefseq, приложите хоть какие-либо усилия для решения этой задачи.
Покажите код, который у вас получился и я либо кто-нибудь другой подскажем, что в вашем коде нужно поправить.

Альтернативный вариант - создать топик в разделе «Работа», правила раздела только прочитайте.
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как мышкой перемещать Div блок? Simon Общие вопросы Javascript 26 18.03.2024 12:37
Как обновить содержимое div (или какую функцию вызвать)? unity555 Events/DOM/Window 3 19.12.2017 16:38
Как скрыть содержимое div до полной загрузки сайта? Georgian Элементы интерфейса 3 01.12.2015 18:30
Как скрыть содержимое div до полной загрузки сайта? Georgian Элементы интерфейса 2 01.12.2015 16:15
toggly скрывает/раскрывает div, но если не скрыть его а выбрать следующую ссылку div pitbullalex Общие вопросы Javascript 7 20.11.2015 09:34