JQuery实用小技巧

自从有了JQuery之后，操作HTML 和 CSS简直太方便了，完全不需要依赖复杂的原生JS了，这是我在FCC上学习JQuery后的总结～

<script>
  $(document).ready(function() {//html css加载完后执行此js代码块

    $("button").addClass("animated shaked");//增加class
    $("button").removeClass("animated shaked");//删除指定的class
    $("#target1").css("color", "red");//改变样式
    $("#target1").prop("disabled", true);//改变属性
    $("#target4").remove();//删除指定的html原色
    $("#target4").html("<p>jal</p>");//指定的标签里加一个标签
    $("#target4").text("<p>jal</p>");//指定的标签加一个文本，不会解析为html
    $("#target2").appendTo("#right-well");//将target2移动到right-well中
    $("#target5").clone().appendTo("#left-well");//将target5复制到left-well中
    $("#target1").parent().css("background-color", "red");//操作父元素
    $("#left-well").children().css("color", "blue");//操作子元素
    $(".target:nth-child(3)").addClass("animated bounce");//操作第n个子元素
    $(".target:odd").addClass("animated shake");//获取class为target且索引为奇数的所有元素，偶数为even
    $("body").addClass("animated fadeOut");//让整个body都有淡出效果(fadeOut)：

  });
</script>
  

 

  
1
  
2
  
3
  
4
  
5
  
6
  
7
  
8
  
9
  
10
  
11
  
12
  
13
  
14
  
15
  
16
  
17
  
18
  
19
  
20
 

文章来源: blog.csdn.net，作者：爱玲姐姐，版权归原作者所有，如需转载，请联系作者。

原文链接：blog.csdn.net/jal517486222/article/details/81432337