jQuery 语法:

      美元符号定义 jQuery:$ ;

      $(document).ready(function(){                jQuery入口函数)
$(function(){ // 开始写 jQuery 代码... });
         开始写 jQuery 代码...
      });
简洁写法:(与以上写法效果相同)                jQuery入口函数)
      $(function(){
         开始写 jQuery 代码...
      });
window.onload  =  function (){                       (JAVA入口函数)
    执行代码...
}
       jQuery 的元素选择器:
在页面中选取所有 <p> 元素:  用户点击按钮后,所有 <p> 元素都隐藏     【hide(隐藏属性)】
$(document).ready(function(){
    $("button").click(function(){
         $("p").hide();
    });
});

id 选择器:

$("#test")

$(document).ready(function(){
     $("button").click(function(){
           $("#test").hide();
      });
});

.class 选择器:

$(".test")

$(document).ready(function(){
       $("button").click(function(){
             $(".test").hide();
       });
});
“*”  选取所有元素:

$(document).ready(function(){
      $("button").click(function(){
           $("*").hide();
       });
});

$(this)  选取当前 HTML 元素:

$(document).ready(function(){
      $("button").click(function(){
           $(this).hide();
       });
});

jQuery 事件方法语法:

点击事件:$("p").click();

$("p").click(function(){
      动作触发后执行的代码!!
});
单击P元素消失:
$("p").click(function(){
      $(this).hide();
});
双击P元素消失:
$("p").dblclick(function(){
      $(this).hide();
 
});

mouseenter( 鼠标移入:)

$("#p1").mouseenter(function(){
       alert('您的鼠标移到了 id="p1" 的元素上!');
});

mouseleave( 鼠标移出:)

$("#p1").mouseleave(function(){
       alert("再见,您的鼠标离开了该段落。");
});

hover(  当鼠标移动到元素上时,会触发指定的第一个函数(mouseenter);当鼠标移出这个元素时,会触发指定的第二个函数(mouseleave)。)

$("#p1").hover(function(){
          alert("你进入了 p1!");
      },
   function(){
           alert("拜拜! 现在你离开了 p1!");
      }
);

 

 

 

 

posted on 2022-03-22 15:23  博塬  阅读(28)  评论(0编辑  收藏  举报