Html jquery: .html() | jQuery API Documentation

jQuery HTML / CSS методы

❮ Предыдущая Следующая Глава ❯

В следующей таблице перечислены все методы, используемые для управления HTML и CSS.

Методы работы ниже для обоих HTML и XML-документов. Исключение: html() метод.

❮ Предыдущая Следующая Глава ❯

Как использовать метод jQuery html()

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

В этом руководстве мы узнаем, как использовать HTML() и его синтаксис. Мы также рассмотрим пошаговый подход к использованию HTML() . jQuery HTML() является фундаментальным методом в библиотеке jQuery и часто используется. Изучив основы, вы будете готовы начать практиковать использование HTML() .

Что такое jQuery html()?

jQuery HTML() устанавливает HTML-содержимое каждого элемента в наборе соответствующих элементов. Следует соблюдать осторожность, чтобы предоставить достаточно конкретный запрос для замены только желаемого HTML.

Найдите свой матч для буткемпа

• Career Karma подберет для вас лучшие учебные курсы по технологиям
• Получите доступ к эксклюзивным стипендиям и подготовительным курсам

Выберите свой интерес
Программная инженерия Дизайн Наука о данных Аналитика данных Информационная безопасность Имя

Фамилия

Электронная почта

Номер телефона

Продолжая, вы соглашаетесь с нашими Условия использования и политика конфиденциальности , и вы соглашаетесь получать предложения и возможности от Career Karma по телефону, текстовым сообщениям и электронной почте.

Меняется только содержимое HTML() . При наличии таблицы стилей новый контент будет оформлен так же, как и предыдущий контент. Стоит также упомянуть, что HTML() работает только с документом HTML — он не работает с XML.

html() Синтаксис jQuery

Напомним, что методы jQuery сначала вызываются для селектора. Селектор может быть как широким, как тег

, так и конкретным, как

с идентификатором (

). Как только нужный элемент выбран, мы можем вызвать HTML() и передать строку HTML в качестве параметра для HTML() . Подробное объяснение селекторов CSS см. гид .

HTML() принимает либо строковый литерал в качестве параметра, либо переменную, содержащую строку. Передача строкового литерала «Новый контент» будет отображаться так же, как передача переменной, ссылающейся на «Новый контент».

Скажем, у нас есть этот простой

:

  Привет, мир 

 

Мы можем заменить весь тег

:

 $('div. main-content').html('
Новый контент
') 

Приведенный выше код отображает новый HTML как:

 
 Теперь наш HTML выглядит следующим образом: 
 <дивмейн>
 

 Привет
 
 

 Мир
 
 

 До свидания
 
 

<скрипт>

Глядя на нашу начальную HTML-страницу, мы увидим, что только слово «Hello» окрашено в синий цвет.

В этом примере мы хотим заменить слово «Привет» новым содержимым, но сохранить исходный стиль. Для этого мы выделяем абзац с именем класса синим цветом.

 $('p.blue').html("СНОВА ПРИВЕТ") 

Мы выбрали абзац, относящийся к классу синего, и заменили «Hello» на «Hello AGAIN». С HTML() заменяет содержимое, завернутое в имена элементов, синий цвет останется.

Что, если бы мы захотели заменить весь текст абзаца? Если мы выберем элемент

, он заменит приведенный выше текст тремя экземплярами «Hello AGAIN».

 $('p').html("СНОВА ПРИВЕТ") 

Здесь мы выбираем все теги абзаца в файле HTML и заменяем содержимое каждого на «Hello AGAIN». Как и в нашем первом примере, исходный стиль будет отображаться, потому что мы заменяем содержимое, заключенное в эти теги.

Как мы и ожидали. Давайте поднимемся на один уровень в нашем селекторе к нашему

, принадлежащему «основному» классу. Здесь пригодится передача строк HTML в качестве параметров.

 $('div.main').html('
Содержимое основного раздела
') 

Внутри нашего основного блока у нас есть три элемента абзаца. Зная, как HTML() работает, мы можем сделать вывод, что приведенный выше код заменит три тега

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

В одной строке кода мы заменили три разных элемента абзаца и использовали стиль нашего исходного класса.

Заключение

jQuery HTML() — это широко используемый метод замены содержимого на HTML-страницах для создания динамического интерфейса. Потому что HTML() заменяет содержимое, заключенное внутри HTML-элементов, важно обратить внимание на селекторы jQuery и любые классы стилей. Это предотвратит любые нежелательные изменения стиля.

Мы узнали, что такое jQuery, его синтаксис и пример того, как его можно использовать. Потратьте некоторое время на практику и освойте этот широко используемый метод.

Автозаполнение | Пользовательский интерфейс jQuery

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52

jquery.com/ui/1.13.2/themes/base/jquery-ui.css"> var viefabletegs = [ "ActionScript", "AppleScript", "ASP", "Basic", 9003 "C ++" CSTREAD "000 9003" CSTH. CSTREAN "9000 " CSTH. "Clojure", "Cobol", "Coldfusion", "Erlang", "Fortran", 0003 "Groovy", "Haskell", "Java", "JavaScript", "Lisp", "Perl", " PHP ", " Python ", " Ruby ", " Scala ", " $ ("#Tags"). Добавить комментарий Отменить ответ Ваш адрес email не будет опубликован. Обязательные поля помечены * Комментарий * Имя * Email * Сайт Поиск: Рубрики Seo Wordpress Дизайн Заработок Плагин Разное Рекомендац Сайт Совет Советы Тем Темы Урок Уроки