В этой статье демонстрируются различные методы удаления CSS из div с помощью jQuery.

• Как удалить CSS из Div с помощью jQuery?
  • Удалить встроенный CSS из Div
  • Удалить класс CSS из Div

Как удалить CSS из Div с помощью jQuery?

Чтобы удалить стили CSS из div, используйте встроенные атрибуты jQuery. Существует два метода, с помощью которых пользователи могут добавлять или удалять стили: встроенный и с использованием классов.

Способ 1: удалить встроенный CSS из Div

Чтобы удалить встроенные стили, применяемые к элементу HTML, удалитьАтрибут() используется метод ».

Он используется, когда требуется небольшая стилизация элемента. Выполните следующие шаги, чтобы справиться с этим:

Шаг 1: Создайте структуру
В файле HTML создайте « <дел> » и добавьте в него несколько HTML-элементов. Например, '

», «

' и '

” используются в приведенном ниже коде:

---

---

< див >
< h1 > Здравствуйте, пользователи Linuxhint. < / h1 >
< h2 > Linuxhint - это место рая < / h2 >
< п > запросы, связанные с языками программирования. < / п >
< / див >
< кнопка > Удаление стилей для Div < / кнопка >

После выполнения приведенного выше кода веб-страница выглядит так:

Вывод показывает HTML-структуру div и кнопки.

Шаг 2: Добавьте встроенный стиль
Внутри открывающего тега div используется « стиль ” и примените некоторые свойства CSS, чтобы сделать элементы заметными и привлекательными:

< див стиль '=' '
цвет: темно-пурпурный;
цвет фона: средний аквамарин;
поле: 20 пикселей;
отступ: 30px;' >
< h1 >Здравствуйте, пользователи Linuxhint< / h1 >
< h2 >Linuxhint - это рай< / h2 >
< п >запросы, связанные с языками программирования.< / п >
< / див >
< бр >
< кнопка > Стиль Удалять для Раздел< / кнопка >

Вывод приведенного выше кода:

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

Шаг 3: Использование jQuery для удаления встроенного CSS
Чтобы удалить атрибуты стиля, родительская функция вызывается, когда « документ ' является ' готовый ». В приведенном ниже коде внутренняя функция вызывается, когда пользователь нажимает кнопку « кнопка ». После этого эта функция выбирает все элементы div, находящиеся на странице, и использует « удалить.Атрибут() метод:

< сценарий >
$ ( документ ) .готовый ( функция ( ) {
$ ( 'кнопка' ) .клик ( функция ( ) {
$ ( 'див' ) .removeAttr ( 'стиль' ) ;
} ) ;
} ) ;
< / сценарий >

После добавления кода jQuery веб-страница работает следующим образом:

Приведенный выше «gif» показывает, что примененные стили в div удаляются при нажатии на кнопку.

Способ 2: удалить класс CSS из Div

Второй способ стилизации HTML-элемента заключается в назначении им « сорт ». Затем добавьте CSS в эту часть класса внутри « <стиль> ” или в отдельном “ CSS-файл ». Эти стили также можно удалить с помощью jQuery. Выполните следующие шаги:

Шаг 1: Назначьте класс элементу Div
В файле HTML назначьте атрибут класса « <дел> элемент. Кроме того, назначьте идентификатор «удаления» для « <кнопка> ' ярлык:

< див сорт '=' 'укладка' >
< h1 >Здравствуйте, пользователи Linuxhint< / h1 >
< h2 >Linuxhint - это рай< / h2 >
< п >запросы, связанные с языками программирования.< / п >
< / див >
< кнопка идентификатор '=' 'удалять' > Стиль Удалить < / кнопка >

Далее переходим в « <стиль> ” и выберите имя класса div “ стиль ” и введите свойства CSS, которые применяются к элементу div:

< стиль >
.стиль {
цвет :золотник;
фон- цвет : цвет морской волны;
поле: 20 пикселей;
отступ: 30 пикселей;
}
< / стиль >

После выполнения приведенного выше кода веб-страница выглядит так:

Вывод показывает, что стили применены к элементу div.

Шаг 2. Добавьте jQuery для удаления стилей CSS
В ' <скрипт> » добавьте код jQuery, такой же, как указано в приведенном выше методе. jQuery “ удалитькласс() ' метод удаляет ' стиль », которому присваивается элемент «div» при нажатии кнопки:

< сценарий >
$ ( документ ) .готовый ( функция ( ) {
$ ( 'кнопка' ) .клик ( функция ( ) {
$ ( 'див' ) .removeClass ( 'укладка' ) ;
} ) ;
} ) ;
< / сценарий >

После добавления приведенного выше кода веб-страница работает следующим образом:

Приведенный выше «gif» показывает, что стили, набранные в классе, удаляются одним нажатием кнопки.

Заключение

Чтобы удалить CSS из div, « удалить.Атрибут() ' и ' удалитькласс() можно использовать методы. “ удалить.Атрибут() ” удаляет “ стиль ” атрибут выбранного элемента. С другой стороны, « удалитькласс() ” удаляет выбранный класс элемента, который использовался для применения стилей к этому элементу. В этой статье успешно продемонстрировано, как удалить CSS из div с помощью jQuery.