ホームページ  >  記事  >  ウェブフロントエンド  >  jQuery_jqueryにおけるDomの基本操作まとめ

jQuery_jqueryにおけるDomの基本操作まとめ

WBOY
WBOYオリジナル
2016-05-16 17:02:44821ブラウズ
jquery の各ノードの基本操作
コードをコピー コードは次のとおりです。





jquery での Dom 操作




とはあなたの好きな果物は何ですか?



  • Apple

  • バナナ
  • >
  • スイカ



あなたの好きな果物は何ですか?
好きな果物は何ですか?











;

jquery の属性とスタイルの基本操作
コードをコピーコードは次のとおりです:





属性操作






  • Apple

  • バナナ < ;/li>
  • 水瓜








<スクリプト タイプ="text/javascript" language="javascript">
$(function(){
$("#btnSetOrGetAttr").click(function(){
var p = $("p" ).attr("title");//属性の取得
alert(p);
var pSet=$("p").attr("title","これはリセットしたタイトル属性です ") ;
alert(pSet.attr("title"));//リセットされたタイトルを取得します
});

$("#btnDeleteAttr").click(function( ){
var p=$("p").removeAttr("title");
alert(p.attr("title"));
});

$ ("#btnSetOrGetStyle ").click(function(){
var p=$("p").attr("class");//p 要素のクラスを取得
alter(p);
var pSet =$("p").attr("class","height");//クラスを高さに設定します;
alert(pSet.attr("class"));///設定値を取得します class
});

$("ul li").click(function(){
}) $(this).addClass("another");//li の別のクラスを追跡します。このとき、最初の li は 2 つのクラス値を持ち、スタイルはマージされ、同じスタイル属性については後者が前者をオーバーライドします。
});

$("#btnRemoveStyle" ). click(function(){
// $("ul li").removeClass("height");// スタイルの削除を示します
// $("ul li").removeClass(" height another "); // 2 つのスタイルを削除します
$ (" ul li ").RemoveClass (); // li のすべてのクラスの代表

// 特定のスタイルが含まれているかどうかを判断します ,はいの場合は true を返し、それ以外の場合は false
var flag = $("p").hasClass("another");//$("p").is(".another") と同等
alert(flag);
});
})



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