ホームページ >ウェブフロントエンド >jsチュートリアル >jQuery_jqueryでのaddClass()メソッドの使用例

jQuery_jqueryでのaddClass()メソッドの使用例

WBOY
WBOYオリジナル
2016-05-16 16:22:101231ブラウズ

この記事の例では、jQuery での addClass() メソッドの使用法について説明します。皆さんの参考に共有してください。具体的な分析は次のとおりです。

このメソッドは、一致する要素に 1 つ以上のクラスを追加します。
このメソッドには複数の文法形式があります。

文法構造 1:

指定されたクラス名を一致する要素に追加します。複数のクラス名を一度に追加する場合は、スペースで区切ってください。

コードをコピー コードは次のとおりです:
$(selector).addClass(class)

パラメータリスト:

参数 描述
class 定义被添加类的名称

コード例:

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



<頭>


addClass 関数スクリプト ホーム


<スクリプトタイプ="text/javascript">
$(document).ready(function(){
$("#btn").click(function(){
$("div").addClass("ボーダーリセット");
})
})



スクリプト ホームはあなたを歓迎します




上記のコードは、div に 2 つのクラスを追加し、div の境界線とフォント スタイルを設定できます。

文法構造 2:

関数の戻り値を追加するクラスの名前として使用します。

コードをコピー コードは次のとおりです。
$(selector).addClass(function(index,oldclass) ))

パラメータリスト:

参数 描述
function(index,oldclass) 函数定义返回需要添加的一个或多个类名。
index - 可选,接受选择器的索引位置。
oldclass- 可选,接受选择器的当前的类名。

实例代码:

复制代 代码如下:



<頭>


addClass()関数数-脚本之家


<スクリプトタイプ="text/javascript">
$(document).ready(function(){
  $("#btn").click(function(){
    $("div").addClass(function(){
      return "境界リセット";
    })
  })
})



 
脚本之家欢迎您

 


上のコードと最初の例の機能は、追加されないタイプが関数によって返されることを除いて同様です。

ここで説明されている大規模な jQuery プログラムの設計が役立つことを望みます。
声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。