jquery が html タグのスタイルを変更する方法 (2 つの実装方法)_jquery

HTML タグの変更方法については、js の場合、setAttribute でタグの属性を設定し、getAttribute でタグの属性を取得できます。もちろん、同様の機能は jq よりもはるかに簡単です。 js.
ラベル属性を変更してスタイルを変更します
js はラベルの属性を設定および取得します

コードをコピーします コードは次のとおりです:

JS の window.onload メソッド ブロックの内容が JQ の $(function( ){}) メソッドブロック その後、再度実行します。

CSS スタイルを変更してラベルのスタイルを変更します
基本的な構文を見てください:

コードをコピー コードは次のとおりです:

$("#attr").addClass("banner");// スタイルを追加

$("#attr") .removeClass( "banner");//スタイルの削除
//JQ は共同書き込みをサポートしています。removeClass の戻り結果も Jq オブジェクトなので、Jq オブジェクトのすべてのメソッドとイベントを使用できます。
$ ("#attr ").removeClass("banner").addClass("bannerOver");


以下は、dd ラベルをクリックしたときに現在の dd ブロックを強調表示する例です

コードをコピーします コードは次のとおりです。

$( ) {
$('#menu_title').find('dd').click(function () {
$('#menu_title').find('dd').removeClass('cur') ;
$(this).addClass('cur')
})
})

人間

進化した動物の一種

猫

ネコ科の祖先

テーブルのインターレースカラー変更効果





コードをコピーします

コードは次のとおりです:
.odd { 背景: #808080; }

.even { 背景: #0094ff; } .hover { 背景: #808080; } 🎜 > コードをコピー

コードは次のとおりです:


var $trs = $("# menu_title>dd"); //すべての行を選択 $trs.filter(":odd").addClass("odd"); //奇数の行に奇数のスタイルを追加 $trs.filter(":even") ).addClass( "even"); //奇数のスタイルを偶数行に追加します

行をクリックした後、現在の行を強調表示しますコードをコピー

コードは次のとおりです:

//行をクリックして色変更スタイルを追加します
$trs.click( function(e) {
$(this).addClass("selected")

.siblings() .removeClass("selected") ;
マウスの移動イベントと移動イベントを追加します

コードをコピーします コードは次のとおりです:

// マウスの出入り
$("#menu_title>dd").hover(
function () {
$(this).addClass("hover");
},
function () {
$(this).removeClass("hover");


それでは、スタイルについて話しましょうタグの制御です。読んでいただきありがとうございます。