Jquery 事件 DOM操作

Posted 2020-09-21 天晴微笑

常规事件：

  把JS的事件  on去掉即可 

  例如：js    document.getElementById("id").onclinck=function(){}

          Jquery  $("#id").click(function(){  事件发生的事});

复合事件

    hover(function(){}   ,   function(){})     移入移出事件

    toggle(function(){} , function(){}  ....)可以有无数个function   点击循环 事件    点击一次发生第一个function方法  再点击 就发生第二个方法  

未来元素   就是操作创建之后的元素（例如 创建div  或者select的option）

创建之后的元素.live("事件名"，function（）{})；

 

冒泡事件

阻止冒泡事件  return false

 

 

DOM操作

操作属性

获取     $("选择器").attr("属性名");

设置    $("选择器").attr("属性名", "值");

删除   $("选择器").removeAttr("属性名");

 

操作样式

 获取   $("选择器").css("样式名")；

设置     $("选择器").css("样式名"，"值")；

 

操作样式表

 添加     $("选择器").addclass("class名")

移出      $("选择器").remove("class名")

添加移出  交替  $("选择器"). toggleclass("class名")

 

 

操作内容

表单元素

取值        $("选择器").val（）

赋值        $("选择器").val（"值"）

非标单元素

取值        $("选择器").text()

               $("选择器").html()

赋值          $("选择器").text("值")

               $("选择器").html("值")

 

操作相关元素

父辈    $("选择器").parent()

前辈    $("选择器").parents("前辈的选择器")     针对带有class 的选择器

 

后代    $("选择器").children()

子代    $("选择器").find(选择器)

 

哥哥     .prev()     没有以前  空格代表一个   这里不用空格代表

           .prevAll(选择器)

弟弟     .next()

           .nextAll(选择器)

 

操作元素

新建         $("html 字符串")

例如：   $("#div1").append( $( " <div class=‘div2‘> </div>  ") );  

添加    .append(Jquery对象)

下部评级添加   相当于添加弟弟级     after(对象)

上部级添加       before（对象）

 

 移出/清空元素      .empty();

                       .remove();

赋值     .clone（）