jQuery学习笔记

jQuery笔记

简介

1. 基于js框架
2. 轻量级（核心思想：写得更少，做的更多）
3. 优势：
   • 简化js代码
   • 能够像css选择器一样方便获取元素

   //获取id为div1的元素
   document.getElementById("div1");
   $("#div1")
   //获取class值为one的元素
   $(".one")
   $("div")
   

   • 可以修改css属性控制页面效果
   • 兼容性

jQuery的引入

<!-- 引入jQuery包 -->
<script src="js/jquery-1.8.3.min.js" ></script>
<script type="text/javascript">
// 在这里写jQuery代码
$(function(){
    alert("使用jQuery");
})
//当浏览器加载完最后一个HTML元素后，立即执行function()
</script>

jQuery选择器

• 基本选择器
  1. 元素名选择器：根据元素的名称选中指定名称的元素。$("元素名称")

     

  2. id选择器：根据元素的id属性值,匹配具有特定id的元素。$("#id值")

     

  3. 类选择器：根据元素的class属性,匹配所有class值相同的元素。$(".class值")

     

• 层次选择器
  1. 后代选择器：$("祖先元素 后代元素")
  2. 子元素选择器：$("祖先元素>子元素")
  3. 相邻兄弟选择器：
  4. $("#two~div")