版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/jal517486222/article/details/81432337
自从有了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>