Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 02.10.2020, 07:44
Аватар для Faster
Новичок на форуме
Отправить личное сообщение для Faster Посмотреть профиль Найти все сообщения от Faster
 
Регистрация: 22.09.2020
Сообщений: 7

аналог .classList.contains для ID/другого аттрибута
Доброе время суток, решаю интересную задачу и потребовалось определять есть ли в составе потомков элемента нужный мне элемент ...

первым на ум пришло детектить его через список классов структурой :
clicked_el.classList.contains(className)

но элементов много и они уникальны и придется сгенерировать кучу классов динамически и в общем все перебрать , возможно использовать конечно элемент id, находя любой у которого он есть а там длаее уже разбераться но хотелось бы создать свой атрибут конструкцией типа :
elemement.setAttribute("MyAttr", value)

и уже потом считать что если мышкой ткнули туда где есть у потомков атрибут MyAttr делать какие либо действия ...

пока что пришло в голову это перебрать всех потомков элемента и у всех проверять через .hasAttribute , но это реально как то печально и не красиво ... и да это AJAX окно и когда вчера после трех часов тыкания у меня был раскрыт TreeView d 1500 прогруженных элементов и я в него таким образом ткнул , хром слегка подафигел и повис .... в связи с чем есть вопрос

естьли аналог конструкции :

.classList.contains
но для своего аттрибута ?
Ответить с цитированием
  #2 (permalink)  
Старый 02.10.2020, 08:07
Профессор
Отправить личное сообщение для voraa Посмотреть профиль Найти все сообщения от voraa
 
Регистрация: 03.02.2020
Сообщений: 719

Чего то не то вы изобретаете
Не надо придумывать свои атрибуты. Для этого есть атрибут data-*
https://developer.mozilla.org/ru/doc...ributes/data-*
Для выбора элементов с нужными классами, атрибутами, потомков и проч есть querySelector(All)
https://developer.mozilla.org/ru/doc.../querySelector
https://developer.mozilla.org/ru/doc...erySelectorAll
Ответить с цитированием
  #3 (permalink)  
Старый 02.10.2020, 09:38
Аватар для Faster
Новичок на форуме
Отправить личное сообщение для Faster Посмотреть профиль Найти все сообщения от Faster
 
Регистрация: 22.09.2020
Сообщений: 7

voraa, ну про data- я думал но он ничем не хуже своегопридуманного так как так же нет функций под него

насчет querySelector(All) вы плохо прочитали или я плохо объяснил ...
у меня есть извесный элемент ... ОН ЕСТЬ и он не document а , querySelector свойство только docement'а так что не вариант
Ответить с цитированием
  #4 (permalink)  
Старый 02.10.2020, 10:06
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 29,272

Сообщение от Faster
querySelector свойство только docement'а
Ответить с цитированием
  #5 (permalink)  
Старый 02.10.2020, 10:16
Профессор
Отправить личное сообщение для voraa Посмотреть профиль Найти все сообщения от voraa
 
Регистрация: 03.02.2020
Сообщений: 719

Сообщение от Faster
data- я думал но он ничем не хуже своегопридуманного так как так же нет функций под него
Не рекомендуется придумывать свои атрибуты. Нет никакой гарантии, что в какое то время не появится атрибут с таким именем. Именно для этого были придуманы атрибуты data-*
Сообщение от рони
а , querySelector свойство только docement'а так что не вариант
querySelector и querySelectorAll есть у любого элемента.

Если нужен какой то конкретный элемент, то использовать id самое оно.
пусть есть элемент parent и нам надо узнать входит ли в число его потомков элемент с id='myid'

parent.contains(document.getElementById('myid')) // true - если потомок, false - если нет.

Если у элемент потомка есть data-elem='myelem', то
parent.contains(document.querySelector('[data-elem=myelem]')) // true - если потомок, false - если нет.
или
parent.querySelector('[data-elem=myelem]') // вернет сам элемент с data-elem=myelem, если потомок, null - если нет

Последний раз редактировалось voraa, 02.10.2020 в 10:38.
Ответить с цитированием
  #6 (permalink)  
Старый 05.10.2020, 03:07
Аватар для Faster
Новичок на форуме
Отправить личное сообщение для Faster Посмотреть профиль Найти все сообщения от Faster
 
Регистрация: 22.09.2020
Сообщений: 7

voraa, спасибо !

был уверен что querySelectorAll ест ьтолько у документа ... эх вот почему я говорю нельзя всем заниматься одновременнно тогда задача упрощается
Ответить с цитированием
  #7 (permalink)  
Старый 05.10.2020, 06:24
Аватар для Faster
Новичок на форуме
Отправить личное сообщение для Faster Посмотреть профиль Найти все сообщения от Faster
 
Регистрация: 22.09.2020
Сообщений: 7

Не прошло :(
e=mouse event
function plg_m1vpopup_CheckMenu(e) {
    var el = e.srcElement || e.target;
    console.log("CheckMenu:" + el.nodeName);
    //проверяем всех предков
    let way = "";
    do {
        way = el.nodeName;
        console.log(way);
        if (el.nodeName == 'LI' && el.hasAttribute('data-m1vpopupmenuid')) {
            //Найден предок с признаком меню
            console.log("found [data-m1vpopupmenuid] in " + way + " element =" + el.nodeName);//DEBUG:
            return el;
        }
    } while (el = el.parentNode);

    console.log("[data-m1vpopupmenuid] not found");
    return false;


В общем вот код мой который работает . но как я говорил ранее в случае клика там где не предусмотрено меню , например на treeView с парой сотен пунктов это вызывает циклический перебор браузерпрям реально переберает все по порядку а хочется более изящного решения

Есть ли вариант поизящнее вариант или нет ?
Ответить с цитированием
  #8 (permalink)  
Старый 05.10.2020, 08:23
Профессор
Отправить личное сообщение для voraa Посмотреть профиль Найти все сообщения от voraa
 
Регистрация: 03.02.2020
Сообщений: 719

Извините, а вы для каких браузеров это делаете (по каким книжкам js изучаете)? Вряд ли нужно сейчас писать в расчете на ИЕ8 и более ранние.

Сейчас не нужны никакие e.srcElement. Только e.target
И есть функция elt = element.closest(selectors)
см https://developer.mozilla.org/ru/doc...lement/closest

Есть еще функция matches
https://developer.mozilla.org/ru/doc...lement/matches

Поэтому
el.nodeName == 'LI' && el.hasAttribute('data-m1vpopupmenuid')
записывается, как
el.matches('li[data-m1vpopupmenuid]')

А весь цикл, как
el = e.target.closest('li[data-m1vpopupmenuid]') // 'элемент-предок, если есть такой, null - если нет

Последний раз редактировалось voraa, 05.10.2020 в 08:31.
Ответить с цитированием
  #9 (permalink)  
Старый 05.10.2020, 10:29
Аватар для Faster
Новичок на форуме
Отправить личное сообщение для Faster Посмотреть профиль Найти все сообщения от Faster
 
Регистрация: 22.09.2020
Сообщений: 7

изучаю ? не незнаю такого слова

по сути то что я делаю юзается в подразделени РЖД , и поверь мне IE8 ты тут никого не удевишь ...

по этому ипишу такие костыли...


за остальное спасибо ... прочту

JS не входет в сферу моих интересов , я всю жизнь в вэбе писал только бакэнды , а сейчас как бы нужно ..

та кто я вообще низкоуровневый програмист / промышленный програмист
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Решение проблемы кодировок для AJAX и PHP без iconv (cp1251 в AJAX) Serge Ageyev AJAX и COMET 10 24.04.2013 20:48
Новая система управления сайтом Scripto CMS deepslam Ваши сайты и скрипты 38 31.01.2011 14:55
Модуль для работы с модулями JSprog Ваши сайты и скрипты 29 02.09.2009 13:31
Аналог wmode=transparent для Canvas или svg lusever Events/DOM/Window 1 15.06.2009 16:05