Объекты jquery: jQuery | Работа с DOM-объектами

Содержание

javascript — Как правильно дополнить объект с помощью jquery?

Вопрос задан

Изменён 4 месяца назад

Просмотрен 75 раз

У меня есть такой json который я разбираю и делаю отрисовку страницы

{
    
    "user": "someuser",
    "message": "нужна помощь"
},
{
    "user": "Бот",
    "message": "чем могу помочь?"
},
{
    "user": "someuser",
    "message": "у меня другой вопрос"
}

Мне нужно читать дополнительные параграфы на странице и дополнять ими мой json — обьект, для отправки на сервер. Позиций(сообщений) может быть около 10-20! .edited-phrase и .phrase-return это то, что уже есть на странице в .client-mess и .bot-mess я заполняю данные из json. Отправку ajax не проблема, проблема сформировать корректно данные( Заранее спасибо!

обновил код вопроса

Финальная версия должна выглядеть так:

    {
        "type": "text",
        "user": "someuser",
        "message": "нужна помощь",
        "edited": "помогите",
        "return": "вернуться шаг_1,
    },
    {
        "user": "Бот",
        "message": "чем могу помочь?"
    },
  {
        "user": "someuser",
        "message": "у меня другой вопрос"
        "edited": "передумал",
        "return": "вернуться шаг_3",
    }
  • javascript
  • jquery
  • json
  • ajax

Нужно свойству переменной, содержащей этот объект, присваивать нужные Вам значения. Наример let k = {‘t1’: ‘v1’}; k.t2 = ‘v2’; По итогу имеем объект k содержащий значение { ‘t1’: ‘v1’, ‘t2’: ‘v2’ }

Это просто по дополнению объекта.

Если вам нужно дополнять конкретные ПОДобъекты, то можно конвертировать исходный объект в массив значений, содержащих ПОДобъекты и работать по ключам этого массива.

7

Зарегистрируйтесь или войдите

Регистрация через Google

Регистрация через Facebook

Регистрация через почту

Отправить без регистрации

Почта

Необходима, но никому не показывается

Отправить без регистрации

Почта

Необходима, но никому не показывается

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими пользовательским соглашением, политикой конфиденциальности и политикой о куки

Неужели jQuery вреден?

Прежде чем начать, позвольте сказать, что мы считаем, что библиотека jQuery сделала очень много для развития Интернета. Она дала разработчикам возможность делать вещи, которые раньше были немыслимы, и подтолкнула производителей браузеров к реализации подобных вещей естественным способом (без jQuery у нас, вероятно, не было бы сейчас такого метода, как document.querySelectorAll). При этом jQuery по-прежнему необходима тем, кто не может зависеть от вкусностей, которые у нас есть на сегодняшний день, а вынужден поддерживать такие реликты прошлого, как IE8 или же еще что похуже.

Однако, несмотря на все наше сочувствие этим беднягам, они все же в меньшинстве. Есть множество разработчиков, которым не нужно поддерживать старые браузеры с небольшой долей рынка. И давайте не будем забывать о тех, кто вообще не является профессиональным веб-разработчиком: для их целей зачастую все возможности jQuery вообще излишни! При этом в настоящее время стало возможным решить такие задачи средствами браузера. Тем не менее, не только это является причиной не использовать jQuery.

Возможно, вам и в самом деле не нужна эта библиотека.

..

Безусловно, это не первая статья, в которой затрагивается вопрос о том, как много из того, что делает jQuery, можно делать средствами самого браузера. Поэтому не будем тратить время на повторение того, что уже написано другими. Чтобы изучить историю этого вопроса достаточно ввести в поисковик запрос «вам не нужен jQuery», и вы получите массу материалов.

Также не будем тратить время на обсуждение размеров файла или того, насколько быстрее работают родные методы браузеров. Об этом тоже уже говорилось ранее.

… но и это не самая главная причина не использовать jQuery сегодня

Чтобы избежать расширения прототипов нативных элементов, jQuery использует свои собственные объекты-обертки. Дело в том, что в прошлом расширение нативных объектов было большим табу не только из-за потенциальных коллизий, но и из-за утечек памяти в старых IE.

Таким образом, при выполнении, например, команды $(«div») возвращается не ссылка на элемент или набор NodeList, а объект jQuery. Это означает, что объект jQuery имеет совершенно иные методы, чем ссылка на элемент DOM, массив с элементами или любой тип NodeList. Тем не менее, эти нативные объекты все время появляются в реальном коде. Насколько бы jQuery ни пытался абстрагироваться от них, вам всегда приходится иметь с ними дело, даже если вы просто оборачиваете их в конструкцию $(). Например, контекст обратного вызова в jQuery методе .bind() является ссылкой на элемент HTML, а не на набор jQuery. Не говоря уже о том, что часто нужно использовать код от нескольких источников — одни из них предполагают использование jQuery, а другие нет. Следовательно, вы получаете код, в котором перемешаны объекты jQuery, нативные элементы и наборы NodeList. И вот здесь и начинается настоящая вакханалия.

Если разработчик следовал соглашению об именах, по которому переменные содержат объекты jQuery (с добавлением знака доллара) и нативные элементы, это будет меньшей из проблем (люди часто забывают придерживаться таких соглашений, но давайте возьмем идеальные условия). В большинстве же случаев такие соглашения соблюдается довольно редко, и это приводит к тому, что код невероятно трудно понять всякому, кто не участвовал в его написании. И внесение любой правки влечет за собой дополнительные ошибки и эксперименты («О, это не объект jQuery, я должен обернуть его в $()!» или «О, это не элемент, я должен использовать ячейку массива [0], чтобы получить элемент!»). Чтобы избежать подобной путаницы, разработчики, которые вносят изменения в код, часто в качестве защиты в конце концов все подряд оборачивают в $(), в результате во всем коде одна и та же переменная будет проходить через $() много раз. По этой же причине становится особенно трудно реорганизовать jQuery из указанного кода. По сути вы запираете себя со всех сторон.

Но даже если все соглашения об именах были соблюдены, вам не удастся иметь дело только с объектами jQuery. Часто необходимо использовать нативный метод DOM или вызывать функцию из скрипта, который не полагается на jQuery. И вот вскоре преобразования в объекты jQuery и обратно будут повсюду, загромождая ваш код.

И кроме этого, если вы будете добавлять свой код в какую-нибудь кодовую базу, вы придете к тому, что вам придется обернуть каждый элемент или ссылку на список узлов в конструкцию $(), потому что вам не известно, какой ввод вы получите. Таким образом, вы оказываетесь запертыми не только в данный момент, но и весь будущий код, который вы пишете для той же кодовой базы, будет сильно ограничен.

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

Прагматичный путь к чистому JS

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

При этом, большинство библиотек написаны таким образом, что они не требуют, чтобы переменная $ была псевдонимом jQuery. Просто вызовите jQuery.noConflict(), чтобы освободить переменную $, и используйте ее где угодно.

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

А помимо всего этого, если вам действительно нравится jQuery API, но вы хотите избежать раздувания кода, обратите внимание на библиотеку Zepto.

WordPress vs Статический HTML: Что лучше для создания сайта?

Меняя мир — обзор TemplateMonster

значений объектов в jQuery | Сообщество Edureka

Нет ответа на этот вопрос. Будьте первыми, кто откликнется.

Ваш ответ

Связанные вопросы в веб-разработке

Чтобы получить значение Value … ПОДРОБНЕЕ

ответил 23 июня 2022 г. в веб-разработке к раджата • 7 480 баллов • 216 просмотров

  • jquery
  • HTML
  • формы
  • флажок

если вы установили для него класс или идентификатор, вы … ПОДРОБНЕЕ

ответил 23 июня 2022 г. в веб-разработке к раджата • 7 480 баллов • 196 просмотров

  • jquery
  • HTML
  • формы
  • флажок

Внутренняя ошибка сервера 500 — это … ПОДРОБНЕЕ

ответил 23 июня 2022 г. в веб-разработке к раджата • 7 480 баллов • 15,591 просмотр

  • JavaScript
  • jquery
  • аякс

Используйте метод JavaScript split() Если вы хотите … ПОДРОБНЕЕ

ответил 23 июня 2022 г. в веб-разработке к раджата • 7 480 баллов • 954 просмотра

  • JavaScript
  • jquery

Чтобы получить подстроку строки в . .. ПОДРОБНЕЕ

ответил 27 июня 2022 г. в веб-разработке к раджата • 7 480 баллов • 496 просмотров

  • jquery

Общий цикл: вар я; for (i = 0; i … ПОДРОБНЕЕ

ответил 28 июня 2022 г. в веб-разработке к раджата • 7 480 баллов • 888 просмотров

  • JavaScript
  • jquery
  • массивов
  • петель
  • итерация

в MDB есть два класса анимации… ПОДРОБНЕЕ

ответил 22 февраля 2022 г. в других к нариккадан • 62 980 баллов • 1481 просмотр

  • JavaScript
  • jquery
  • вау
  • js

Чтобы использовать jquery в узле, вам нужно … ПОДРОБНЕЕ

ответил 21 июня 2022 г. в JQuery к раджата • 7 480 баллов • 1752 просмотра

  • JavaScript
  • jquery
  • узел
  • эфириум
  • 9Блокчейн 0015
  • js
  • н/мин

Могу ли я загрузить миграцию jQuery через RequireJS? . .. ПОДРОБНЕЕ

11 августа 2022 г. в веб-разработке к гаурав • 22 970 баллов • 170 просмотров

  • JavaScript
  • jquery
  • требуется
  • js
  • jquery-миграция

jQuery .on() не работает с ng-repeat, когда я … ПОДРОБНЕЕ

22 августа 2022 г. в веб-разработке к гаурав • 22 970 баллов • 268 просмотров

  • JavaScript
  • jquery
  • угловой
  • js
  • Я хочу напечатать от 1 до 100 чисел, используя массивы только в Javascript 16 ноября 2022 г.
  • Не удается прочитать свойство «push» неопределенного при объединении массивов 2022
  • Когда дженерики Java требуют вместо и есть ли недостатки переключения? 29 сентября, 2022
  • Для чего полезно ключевое слово volatile? 29 сентября 2022 г.
  • Все категории
  • ЧатGPT (11)
  • Апач Кафка (84)
  • Апач Спарк (596)
  • Лазурный (145)
  • Большие данные Hadoop (1907)
  • Блокчейн (1673)
  • С# (141)
  • С++ (271)
  • Консультирование по вопросам карьеры (1060)
  • Облачные вычисления (3469)
  • Кибербезопасность и этичный взлом (162)
  • Аналитика данных (1266)
  • База данных (855)
  • Наука о данных (76)
  • DevOps и Agile (3608)
  • Цифровой маркетинг (111)
  • События и актуальные темы (28)
  • IoT (Интернет вещей) (387)
  • Джава (1247)
  • Котлин (8)
  • Администрирование Linux (389)
  • Машинное обучение (337)
  • Микростратегия (6)
  • PMP (423)
  • Power BI (516)
  • Питон (3193)
  • РПА (650)
  • SalesForce (92)
  • Селен (1569)
  • Тестирование программного обеспечения (56)
  • Таблица (608)
  • Таленд (73)
  • ТипСкрипт (124)
  • Веб-разработка (3002)
  • Спросите нас о чем угодно! (66)
  • Другие (2231)
  • Мобильная разработка (395)

Подпишитесь на нашу рассылку новостей и получайте персональные рекомендации.

Уже есть учетная запись? .

получить | Документация Cypress

Получить один или несколько элементов DOM с помощью селектора или псевдоним.

Синтаксис​

 cy.get(селектор) 
cy.get(псевдоним)
cy.get(селектор, параметры)
cy.get(псевдоним, параметры)

Использование​

6 17

Правильное использование

cy.get(‘.list > li’) // Вывод
  • в .list

    Аргументы

    selector (String selector)

    Селектор, используемый для фильтрации соответствующих элементов DOM.

    псевдоним (строка)

    Псевдоним, определенный с помощью команды .as() и указанный с символом @ и именем псевдонима.

    Вы можете использовать cy.get() для псевдонимов примитивов, обычных объектов или даже DOM элементы.

    При использовании псевдонимов с элементами DOM Cypress снова запросит DOM, если элемент DOM с прежним псевдонимом устарел.

    options (объект)

    Передайте объект параметров, чтобы изменить поведение по умолчанию cy.get() .

    8 истина 8 Отображает команду в журнале команд4
    Опция
    По умолчанию Описание
    журнал
    timeout defaultCommandTimeout Время ожидания разрешения cy.get() до истечения времени ожидания
    insideSubject null Элемент для поиска дочерних элементов. Если null, поиск начинается с элемента DOM корневого уровня includeShadowDom includeShadowDom значение параметра конфигурации Нужно ли пересекать границы теневой модели DOM и включать ли элементы внутри теневой модели DOM в полученные результаты.

    Yields ​

    • cy.get() возвращает найденные элементы DOM или результаты псевдонима искать.
    • cy.get() — это запрос, и безопасно связывать дальнейшие команды.

    Примеры

    Селектор

    Получить элемент ввода
     cy.get('input').should('be.disabled') 
    Найти первый
    li 9030 3 9303 потомок2 ul​
  •  cy.get('ul li:first').should('have.class', 'active') 9=local-][id$=-remote]') 
    Найдите элемент с идентификатором, который имеет символы, используемые в CSS, такие как ".", ":".​
     cy.get('#id\\.\ \.\\.1234') // экранировать символ с помощью \\ 

    cy.get() в команде .within()

    cy , он всегда ищет селектор внутри весь документ . Единственным исключением является использование внутри Команда .within().

     cy.get('форма'). within(() => { 
    cy.get('input').type('Pamela') // Выдавать только вводные данные в форме
    cy.get('textarea').type('является разработчиком') // Выдавать только текстовые области в форме
    } )

    Get vs Find​

    Команда cy.get всегда начинает поиск с элемент cy.root. В большинстве случаев это элемент документа , если он не используется внутри .within() команда. Команда .find начинает поиск с текущий предмет.

     
    cy.get и .find


    Обе команды запрашивают


     cy.get('#comparison') 
    .get('div')
    // находит div.test- title вне #comparison
    // и div.feature внутри
    .should('have.class', 'test-title')
    .and('have.class', 'feature')
    cy.get(' #comparison')
    .find('div')
    // поиск ограничен деревом в элементе #comparison
    // поэтому он находит только div.feature
    .should('have.length', 1)
    .and('have. class', 'feature')

    Псевдоним​

    Подробное объяснение алиасинга см. подробнее об алиасинге читайте здесь.

    Получить элементы «todos» с псевдонимом cy.get('@todos')

    Получить элемент 'submitBtn' с псевдонимом
     beforeEach(() => { 
    cy.get('button[type=submit]').as('submitBtn' )
    })

    it('отключается по клику', () => {
    cy.get('@submitBtn').should('be.disabled')
    })

    Получить фикстуру 'users' с псевдонимом
     beforeEach(() => { 
    cy.fixture('users .json').as('users')
    })

    it('отключается по клику', () => {
    // доступ к массиву пользователей
    cy.get('@users').then(( users) => {
    // получить первого пользователя
    const user = users[0]

    cy.get('header').contains(user.name)
    })
    })

    Rules​

    Требования

    • cy.get() требует привязки команды, которая дает элемент(ы) DOM.

    Утверждения ​

    • cy.

    Добавить комментарий

    Ваш адрес email не будет опубликован. Обязательные поля помечены *