Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Сравнить ссылки между собой (https://javascript.ru/forum/dom-window/84867-sravnit-ssylki-mezhdu-sobojj.html)

DVV 20.01.2023 16:31

Сравнить ссылки между собой
 
Подскажите, пожалуйста, как сравнить ссылки между собой. Задача такая. Есть список ссылок в html. При вводе пользователем новой ссылки надо сравнить, есть ли такая уже в html. Почему то постоянно в консоль выдает, что такой ссылки нет, даже если вводить уже существующую. Вводить надо в правый инпут в разметке и нажать на кнопку "Добавить".

https://codepen.io/Viacheslav_Demchenko/pen/PoBEzMy

рони 20.01.2023 17:04

DVV,
js не умеет в телепатию, значение value надо получать непосредственно перед сравнением, перенесите получение данных в функцию, иначе в text и link всегда будет пусто.

DVV 20.01.2023 19:48

Все равно, что-то я не так делаю

https://codepen.io/Viacheslav_Demchenko/pen/PoBEzMy

рони 20.01.2023 20:07

DVV,
нужна переменная -- цикл должен изменить эту переменную, если будет совпадение, и остановится -- после цикла если переменная не изменилась -- создаётся новый элемент.

рони 20.01.2023 20:19

DVV,
<!DOCTYPE html>
<html>
<head>
    <title>Untitled</title>
    <meta charset="utf-8">
</head>
<body>
    <div id="linkContainer">
        <a data-href="https://link1" class="js-additional-link">Ссылка 1</a>
        <a data-href="https://link2" class="js-additional-link">Ссылка 2</a>
    </div>
    <input type="text" id="text" value="есть такая">
    <input type="text" id="link" value="https://link1">
    <button id="add">Добавить</button>
    <script>
        const btnAdd = document.getElementById('add');
        const linkContainer = document.getElementById('linkContainer');
        const txt = document.getElementById('text');
        const lnk = document.getElementById('link');

        function checLinksForMatches() {
            const boxLinkNames = document.querySelectorAll('.js-additional-link');
            const text = txt.value;
            const link = lnk.value;
            if(!text || !link) return;
            let add = true;
            for (let mainLink of boxLinkNames) {
                if (mainLink.dataset.href === link) {
                    console.log('равна');
                    add = false;
                    break;
                }
            }
            if (add) {
                console.log('Не равна');
                const newLink = document.createElement('a');
                newLink.dataset.href = link;
                newLink.textContent = text;
                newLink.classList.add('js-additional-link');
                linkContainer.append(newLink);
                txt.value = '';
                lnk.value = '';
            }

        }
        btnAdd.addEventListener('click', checLinksForMatches);
    </script>
</body>
</html>

DVV 21.01.2023 20:56

Спасибо большое


Часовой пояс GMT +3, время: 16:41.