JQuery复习心得

this === event.currentTarget    event.stopPropagation  阻止冒泡  http:www.css88.com

JQ和原生JS入口函数的区别:

• 书写个数不同
  • 原生JS中入口函数只能出现一次,出现多次后会被层叠掉
  • JQ中可以随意使用,不会被层叠掉
• 执行时机不同
  • 原生JS的入口函数在所有资源文件加载完成后执行。包括外部JS、外部CSS、页面文档、图片
  • JQ的入口函数在文档加载完后就执行，也就是在DOM树加载好后就可以直接操作DOM，不需要等所有外部元素加载完。（但是使用$(window).ready(function () {});可以实现等图片等元素加载完后执行入口函数的效果）

JS和JQ的DOM相互转换

• JS==>JQ
  • var jqdiv = $("jsdiv");  在$后加JS变量名就好
• JQ==>JS
  • var jsdiv = JQdiv[0];  或者  div = JQdiv.get(0);  用[]或者get()传入索引值获取

选择器

• 基本选择器:和CSS中差不多,有 ID选择器  类名选择器  标签选择器  通配符(*)选择器   获取方式也一样
• 层级选择器: 子代选择器  后代选择器
  • 过滤选择器:   :eq(index)指定的元素  :odd获取奇数位的元素,得到的是偶数值  :even偶数位    用法:   $("li:eq(2)")
• 筛选选择器: .find()从后代里找  .children()子代里找  .eq()用法和上边类似,写法有区别  .siblings()兄弟   .parent()父级

节点操作

• 创建节点
  • $("<span></span>");  直接传带标签的内容
  • $("ul").html("<li>你好</li>");  通过父级元素调用html()来创建,若是html()不传任何内容,表示获取ul中的内容
• 添加节点
  • append()  $("oldul").append(newli);
  • appendTo()   上面的反过来就是了
  • prepend()  在盒子的最前边添加  $("ul").prepend(newli);新添加的li成为第一个li
  • prependTo()  你猜猜怎么用
  • after()  $("li").after(newli);新添加的里li在旧的li之后  操作的是兄弟级的元素
  • before()  恩...
• 删除节点
  • .html("")  传空字符,直接清空内容
  • .remove()  自杀式
• 复制节点
  • .clone()  默认深复制调用者