Home >Web Front-end >JS Tutorial >How to delete css style using jq

How to delete css style using jq

青灯夜游
青灯夜游Original
2022-01-20 18:11:307696browse

Deletion method: 1. Use removeClass() or toggleClass() to remove the specified CSS class, the syntax is "removeClass("class name")" or "toggleClass("class name")"; 2. Use removeAttr ()Remove id, class or style attributes.

How to delete css style using jq

The operating environment of this tutorial: windows7 system, jquery1.10.2 version, Dell G3 computer.

How to delete css style in jquery:

1. Use removeClass() or toggleClass() to remove the specified CSS class

removeClass() - Remove CSS class

$("#target").removeClass("oldClass");
//#target 指的是需要移除CSS类的元素的ID
//oldClass 指的是CSS类的名称

toggleClass() - Add or remove CSS class

If the CSS class already exists, it will is removed; instead, if the CSS class does not exist, it will be added.

$("#target").toggleClass("newClass")
//如果ID为“target”的元素已经定义了CSS样式,它将被移除;
//反之,CSS类”newClass“将被赋给该ID。

2. Use removeAttr() to remove id, class or style attributes

<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
  $("button").click(function(){
    $("p").removeAttr("style");
  });
});
</script>
</head>

<body>
<h1>这是一个标题</h1>
<p style="font-size:120%;color:red">这是一个段落。</p>
<p>这是另一个段落。</p>
<button>删除所有 p 元素的 style 属性</button>
</body>
</html>

How to delete css style using jq

(Learning video sharing: css video tutorial)

The above is the detailed content of How to delete css style using jq. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn