jQuery 1

 一、给元素添加(移除)类属性:css

<script>
  
  $(document).ready(function() {
    $("button").addClass("animated"); //标签选择,添加类属性
    $(".btn").addClass("shake");   //类选择器,添加类属性
    $("#target1").addClass("btn-primary");   //id选择器,添加类属性
    $("button").removeClass("btn-default"); //标签选择,移除类属性
  });
 
</script>

二、改变元素的CSS:html

<script>
  $(document).ready(function() {
    $("#target1").css("color","red")  //ID 为target1的标签元素改变颜色为红色
  });
</script>

三、调整CSS外的其余属性:app

<script>
  $(document).ready(function() {

    $("#target1").prop("disabled", true);  //设置按钮不可用
  });
</script>

四、修改标签内容或删除标签:code

<script>
  $(document).ready(function() {
    $("#target1").remove();  //删除ID为target1的标签
    $("#target4").html("<em>#target4</em>");  //修改ID为target4的标签的内容为传入的内容
  });
</script>

五、移动或复制标签元素:htm

<script>
  $(document).ready(function() {

    $("#target2").appendTo("#right-well");  //将ID为target2的标签移动到ID为right-well的容器中
    $("#target5").clone().appendTo("#left-well"); //复制元素,以后添加到对应容器中
  });
</script>

六、访问元素的父级(或子级)元素:ip

<script>
  $(document).ready(function() {

    $("#target1").parent().css("background-color","red"); //父级元素背景色改成红色
    $("#right-well").children().css("color","orange"); //子元素文本变为橙色
  });
</script>
相关文章
相关标签/搜索