Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Как правильно обращаться к крайнему элементу (https://javascript.ru/forum/misc/77406-kak-pravilno-obrashhatsya-k-krajjnemu-ehlementu.html)

Retro_1477 28.04.2019 15:43

Как правильно обращаться к крайнему элементу
 
Вложений: 1
Вложение 4159
При нажатие на кнопку отправления сообщения у меня создаётся маска для пользователя и для бота, но сообщение внутри маски бывают разные. Как правильно обратиться к крайнему элементу?

Часть кода для добавления маски и текста из строки ввода.
chatlog.append(maskUser); //добавление тегов
    let outputUser = $('.chat-mes-user:last-child'); // пытаюсь обратиться к крайнему элементу
    let input = user_input.val();
    outputUser.html(input);

laimas 28.04.2019 15:47

А что есть крайний? :last-child, это последний в родительском наборе, то есть у класса chat-mes-user это будут элементы братья.

PS. Если это попытка найти в наборе элементов с классом chat-mes-user последний элемент, то $('.chat-mes-user:last')

Retro_1477 28.04.2019 16:47

ааа
Ну да. Но всё равно вопрос остаётся. Как обратится крайнему элементу chat-mes-bot и chat-mes-user

<div class="chat user">
    <div class="user-av"></div>
    <p class="chat-mes-user"></p>
</div>
<div class="chat bot">
    <div class="user-av"></div>
    <p class="chat-mes-bot"></p>
</div>
<div class="chat user">
    <div class="user-av"></div>
    <p class="chat-mes-user"></p>
</div>
<div class="chat bot">
    <div class="user-av"></div>
    <p class="chat-mes-bot"></p>
</div>

laimas 28.04.2019 17:13

Цитата:

Сообщение от Retro_1477
Как обратится крайнему элементу chat-mes-bot

Нет крайних, есть первый, последний. Так как показано, так и обращаться:

<html>
<head>
<meta charset="utf-8">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<style>
</style>
<script type="text/javascript">
$(function() {
    alert($('.chat-mes-bot:last').text())
});
</script>
</head>
<body>
<div class="chat user">
    <div class="user-av"></div>
    <p class="chat-mes-user"></p>
</div>
<div class="chat bot">
    <div class="user-av"></div>
    <p class="chat-mes-bot"></p>
</div>
<div class="chat user">
    <div class="user-av"></div>
    <p class="chat-mes-user"></p>
</div>
<div class="chat bot">
    <div class="user-av"></div>
    <p class="chat-mes-bot">Last</p>
</div>

</body>
</html>


Вы чего хотите?

Retro_1477 28.04.2019 18:00

Я вас поправлю, метод пишется следующим образом.

let outputBot = $('.chat-mes-bot').last();


Спасибо за помощь

рони 28.04.2019 18:15

Цитата:

Сообщение от Retro_1477
Я вас поправлю,

let outputBot = $('.chat-mes-bot').last() = $('.chat-mes-bot').filter(':last') = $('.chat-mes-bot:last');

laimas 28.04.2019 18:46

Цитата:

Сообщение от Retro_1477
Я вас поправлю, метод пишется следующим образом.

Нечего править, в JQ есть как метод, так и селектор.


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