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>
相關文章
相關標籤/搜索