Jquery contents: .contents() | jQuery API Documentation

Contents — Professional jQuery [книга]

Contents — Professional jQuery [книга]

Перейти к основному содержанию

Получите полный доступ к Professional jQuery и более чем 60 000 других игр с бесплатной 10-дневной пробной версией O’Reilly.

Есть также прямые трансляции, курсы, созданные по должностям, и многое другое.

Начать бесплатную пробную версию

СОДЕРЖАНИЕ

Часть I. Основы jQuery

Глава 1. Начало работы

Чем хорош jQuery

Требования к оборудованию и браузеру

Получение jQuery и пользовательского интерфейса jQuery

Пример «Hello World»

Соглашения JavaScript, используемые в этой книге

Инструменты разработки Плагин FireQuery

Резюме

Глава 2: Javascript Primer

Понимание чисел

Работа со строками

Понимание логических выражений

Типы сравнения

Краткое примечание о датах

Обзор различных типов

Повторный просмотр переменных

Понимание объектов

Использование функций

Понимание контекста выполнения

Работа с областью действия и замыканиями

Понимание уровней доступа

Применение модулей

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

Расширение типов

Применение лучших практик JS

Собираем все вместе

Резюме

Примечание

Глава 3: Ядро jQuery

Понимание структуры скрипта jQuery

Ненавязчивое использование JavaScript

Структура jQuery Framework

Понимание DOM и событий

Использование jQuery с другими Библиотеки JavaScript

Сводка

Примечания

Глава 4. Выбор элементов DOM и управление ими

Возможности селекторов jQuery

Выполнение обхода DOM

Доступ и изменение элементов, атрибутов и содержимого

Генерация HTML

Сводка

Глава 5. Обработка событий

Понимание модели событий браузера

Понимание того, как jQuery обрабатывает события

Применение обработчиков событий jQuery

Работа с События

Новый API событий JQuery

Сводка

Примечания

Глава 6: Html-формы, данные и Ajax

Оценка данных jQuery

Использование проверок форм

Работа с элементами HTML-форм

Повторение основ Ajax

Применение Ajax с помощью …

Получите Professional jQuery прямо сейчас с обучающей платформой O’Reilly.

члена O’Reilly знакомятся с книгами, живыми мероприятиями, курсами, созданными в зависимости от должности, и многим другим от O’Reilly и почти 200 ведущих издателей.

Начать бесплатную пробную версию

Не оставляйте с пустыми руками

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

Это твое, бесплатно.

Получить сейчас

Проверьте это прямо сейчас на O’Reilly

Получите бесплатную 10-дневную пробную версию обучающей платформы O’Reilly, а затем изучите все другие ресурсы, на которые наши участники рассчитывают, чтобы развивать навыки и решать проблемы каждый день.

Начать бесплатную пробную версиюСтать участником сейчас

jQuery Mobile Docs — Сворачиваемое содержимое

Сворачиваемое содержимое

  • Основы
  • Опции
  • Методы
  • События

Чтобы создать сворачиваемый блок контента, создайте контейнер и добавьте атрибут data-role="collapsible" . Использование атрибута data-content-theme позволяет установить тему для содержимого складного объекта. Просмотрите справку по атрибутам данных, чтобы увидеть все возможные атрибуты, которые вы можете добавить к складным элементам.

Непосредственно внутри этого контейнера добавьте любой элемент заголовка (h2-H6). Фреймворк стилизует заголовок так, чтобы он выглядел как нажимаемая кнопка, и добавит значок «+» слева, чтобы указать, что он расширяемый.

После заголовка добавьте любую HTML-разметку, которую вы хотите свернуть. Фреймворк поместит эту разметку в контейнер, который будет скрыт/отображен при нажатии на заголовок.

По умолчанию содержимое будет свернуто.

data-role="складной" >

Я заголовок

Я сворачиваемый контент. По умолчанию я закрыт, но вы можете нажать на заголовок, чтобы открыть меня.

Я жатка

Я складной контент. По умолчанию я закрыт, но вы можете щелкнуть заголовок, чтобы открыть меня.

Раскрытие складных элементов при загрузке

Чтобы расширить содержимое при загрузке страницы, добавьте атрибут data-collapsed="false" в оболочку.

data-collapsed="false">

Этот код создаст сворачиваемый виджет, например:

Я заголовок

Я сворачиваемый контент. Я развернут по умолчанию, потому что для меня установлено состояние «свернутое» на false.

Мини-складные элементы

Для более компактной версии, которая будет полезна на панелях инструментов и в ограниченном пространстве, добавьте к элементу атрибут data-mini="true" , чтобы создать мини-версию.

data-mini="true">

Этот код создаст мини-складной виджет:

Я мини-заголовок

Я сворачиваемое содержимое. Я развернут по умолчанию, потому что для меня установлено состояние «свернутое» на false.

Положение значка

Положение значка по умолчанию для складных заголовков можно переопределить с помощью атрибута data-iconpos . В приведенном ниже случае data-iconpos="right" .

Я заголовок

data-iconpos="right"

Тематическое оформление сворачиваемого содержимого

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

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

data-content-theme="c" >

Образец заголовка A

Я сворачивающийся контент с тематическим блоком контента, установленным на "C".

Образец заголовка

Я — сворачиваемое содержимое с тематическим блоком содержимого, установленным на «C».

Тематическое оформление сворачиваемых заголовков

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

data-theme="a" data-content-theme="a" >

Образец заголовка A

Я сворачивающийся контент с тематическим блоком контента, для которого установлено значение "A".

Образец заголовка A

Я — сворачиваемое содержимое с тематическим блоком содержимого, установленным на «A».

Образец заголовка B

Я — сворачиваемое содержимое с блоком тематического содержимого, для которого установлено значение «D».

Вложенные складные элементы

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

Я заголовок

Я складной контент. По умолчанию я открыт и отображается на странице, но вы можете щелкнуть заголовок, чтобы скрыть меня.

Я вложенная разборная с дочерней разборной

Я дочерняя разборная.

Снова вложен внутрь.

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

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