ホームページ >ウェブフロントエンド >フロントエンドQ&A >jqueryでボタンをクリックしてスタイルの行を削除する方法
方法: 1. 「.class」セレクターを使用して、指定した要素行のスタイルを設定します; 2. クリック イベントをボタンにバインドし、処理関数を指定します; 3. RemoveClass() を使用します。指定を削除する関数内のメソッド 行要素のクラスを指定することで、スタイルの行を削除できます。構文は「element object.removeClass("指定されたクラス")」です。
このチュートリアルの動作環境: Windows10 システム、jquery3.2.1 バージョン、Dell G3 コンピューター。
jquery のボタンをクリックしてスタイルの行を削除する方法
.class セレクターを使用して、指定した要素のスタイルを設定できます。
このように、要素のスタイルを一括で削除することができます。スタイルはcssメソッドでも削除できますが、直接削除できないため、removeClassメソッドを使用します。
removeClass() メソッドは、選択した要素から 1 つ以上のクラスを削除します。
例は次のとおりです。
<html>
<head>
<meta charset="utf-8">
<title>123</title>
<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
$("button").click(function(){
$("p").removeClass("intro");
});
});
</script>
<style type="text/css">
.intro{
font-size:120%;
color:red;
}
</style>
</head>
<body>
<h1>这是一个标题</h1>
<p class="intro">这是一行段落。</p>
<p >这是另一行段落。</p>
<button>移除指定一行的样式</button>
</body>
</html>出力結果:
ボタンをクリックした後:
推奨される関連ビデオ チュートリアル: jQuery ビデオ チュートリアル
以上がjqueryでボタンをクリックしてスタイルの行を削除する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。