Форум

win32s · #1 (**permalink**) 07.06.2020, 14:31

Здравствуйте
Тупой вопрос, но не могу сам справиться. Есть код, вида

$("#E1").click(function() .. и тут что-то происходит..

Мне нужно как-то получить значение - InnerText из элемента, расположенного чуть повыше. Написал такую конструкцию

var x = document.getElementById('E1');
console.log(x.parentElement.parentElement.parentElement.children[1].innerText);

Но проблема в том, что не хотелось бы делать двойную работу, можно ли как-то "преобразовать" $("E1") в переменную х, чтобы не вызывать дополнительно getElementById ? Или средствами Jquery получить этот текст (пробовал

$(this).parent().parent().parent().children()['1']

, почему-то не работает).

Я понимаю, что код ужасный, но уж какой есть.

laimas · #2 (**permalink**) 07.06.2020, 14:41

$("#E1").click(function() тут this, это #E1, а то что выше можно найти как closest(селектор)

Белый шум · #3 (**permalink**) 08.06.2020, 01:57

win32s, доступ по индексу и возвращает обычный DOM:

$(this).parent().parent().parent().children()[1].innerText

или

$(this).parent().parent().parent().children().eq(1).text()

или

this.parentElement.parentElement.parentElement.children[1].innerText

laimas · #4 (**permalink**) 08.06.2020, 02:06

Белый шум, зачем же, если в обработчике this уже и возвращает ссылку на DOM элемент, да и зачем так много раз "проклинать предков".

this.closest("selector")

Белый шум · #5 (**permalink**) 08.06.2020, 02:37

laimas, про closest вы уже рассказали, я лишь немного дополнил ответ.

win32s · #6 (**permalink**) 08.06.2020, 20:03

Спасибо, все работает.
Подскажите еще, в чем отличие $(this) и this в контексте jQuery? Или где можно почитать?

laimas · #7 (**permalink**) 08.06.2020, 20:13

Сообщение от win32s

$(this) и this в контексте jQuery?

$(this) - это JQ объект. Чтобы получить DOM, то либо методом .get(0), либо просто указав индекс, как выше писал Белый шум. Вот только бессмысленно так поступать, если требуется DOM объект, а не JQ, так как ссылка на него в обработчике всегда есть - this. Это как вместо того чтобы просто получить в обработчике значение this.value, делать это так $(this).val(). Правда есть отличие в этом - если определен $.valHooks, то $(this).val() вернет значение с удаленными крайними пробелами.

http://jquery.page2page.ru/index.php5/On

рони · #8 (**permalink**) 08.06.2020, 20:20

win32s,
если грубо
просто this, это либо сам элемент или объект jQuery вида {0 : элемент};
$(this) это только объект jQuery {0 : элемент}

laimas · #9 (**permalink**) 08.06.2020, 20:42

win32s, в обработчике выполнить console.log(this, $(this)), это будет визуализация того, что рони написал.

Белый шум · #10 (**permalink**) 08.06.2020, 21:33

win32s,
this - это указатель на контекст функции, который jQuery в своих обработчиках всегда устанавливает на соответствующий DOM элемент.
Читать тут: https://api.jquery.com/Types/#Function

$( ) - стандартная функция jQuery, которая возвращает объект jQuery. Если ей передать в качестве параметра элемент DOM, то она вернёт не пустой объект jQuery, а с указателем на этот элемент. Примеры:

<head>
<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
<script>
   console.log( *!* $(document) */!* );
   console.log( *!* $(window) */!* );
   console.log( *!* $(this) */!* );
   $(document).click(function(event){ console.log( *!* $(event.target) */!* ); })
</script>
</head><body><p>Кликни <span>тут...</span></p></body>

Читать тут: https://api.jquery.com/Types/#jQuery

Сообщение от рони

просто this, это ... или объект jQuery вида {0 : элемент};

Можно подробнее про это "или"? В каких случаях там будет объект jQuery?

Форум

Справочник

Discord чат

Курсы javascript