Jquery

jQuery中的顶级对象

浏览器中的顶级对象:window,浏览器中和页面中所有的东西都是window的
页面中的顶级对象:document,页面中某些东西是document
jQuery中的顶级对象:jQuery----可以用 $ 符号来代替,为了方便,jQuery(jQuery的js文件中的所有的东西都是jQuery或者都是$符号下的)

• 简单的写法: $ .属性,或者$.方法

  • 大多数情况下,jQuery中几乎都是方法,属性很少
  • jQuery中几乎把DOM中的事件都封装成了一个方法,在jQuery中几乎是把on去掉,然后变成方法了
  • DOM中注册事件
  • 例子:
  • document.getElementById(“id属性值”).匿名函数;
  • jQuery中注册事件
  • 例子:
  • $("#id属性值").click(匿名函数);

---

jQuery对象和DOM对象互转的问题

//DOM对象
var btnObj=document.getElementById(“btn”);
//jQuery对象
$(btnObj)
//
$(btnObj)[0]

---

表单标签DOM操作中设置和获取value属性的值

Query对象.val();-------表示的是获取该元素的value属性值

• jQuery对象.val(“值”);----表示的是设置该元素的value属性
• jQuery对象.css(“css的属性名字”,“属性的值”);---->设置元素的样式属性值
• 注意:
• .css(“属性”,“值”);属性的写法可以是DOM操作中的js写法,也可以是css中的写法

---

页面加载的事件

 //页面加载事件

    //jQuery中第一种页面加载的事件

$(window).load(function () {
      console.log("哈哈,小杨好帅哦");
 });

 $(document).ready(function () {
       console.log("2");
 });

jQuery(function () {
      console.log("页面加载了2222");
 });

$(function () {
    console.log("页面加载了2");
 });

---

选择器

• ID选择器：$（"#id"）：某个元素

• 标签选择器： $ (“标签名字”)：多个元素或者某个元素

  .text()方法相当于innerText()属性
  .text(“值”)：设置

• 类选择器：$(".类样式的名字")

• 交集选择器：标签+类选择器

• 并集选择器：选择器，选择器，选择器（逗号隔开）

• 层次选择器：
  1、后代选择器
  $("#dv span"):获取div父元素后面所有的span标签
  2、直接子类选择器
  $("#dv>span")，div父级后的直接子元素span
  3、后兄弟选择器
  $("#dv~span")，div后的所有兄弟标签span

---

元素移除

$("#id").remove();// 自杀

// 移除所有父级元素下的子元素
$("#id").html("");
$("#id").empty(); //清空