jQuery操作DOM

选择器

• 基本选择器: #id、.class、element、*、

• 层级选择器：空格、> 、+ 、~

• 基本过滤选择器：:first,:last,:eq(index),:gt(index),:lt(index),:odd,:even

• 筛选选择器: :eq(index),.children(),.parent(),.siblings(),.find()

• 动画：show,hide,fadeIn,fadeOut,fadeTo,slideDown,slideUp,slideToggle,animate

• DOM操作：clone(),after(),.css,addClass("className"),removeClass(),toggleClass(),.attr(),removeAttr(),.val(),.html("

  "),text(),node.append("

  我是追加的内容

  ")，prePend

元素操作

• 高度和宽度 :$("div").height();$("div").width(); .height返回的数字类型，.css("height")返回的是字符串类型

• 坐标值 ：$("div").offset();获取或设置坐标值，设置后变成相对定位；$("div").position();获取坐标值，子绝父相 只能读不能设置

• 滚动条 ： $("div").scrollTop();$("div").scrollLeft();

jquery事件

• 绑定 ：click/mouseenter/blur/keyup/change bind:$node.bind("click",function(){});

• 触发一次 ：

  1. one:$node.one("click",function(){});
  2. delegate:$node.delegate("p","click",function(){});
  3. on:$node.on("click","p",function(){});

• 解绑：unbind、undelegate、off

• 触发

  1. click : $("div").click();
  2. trigger:触发事件，并触发浏览器默认行为
  3. triggerHandler:不触发浏览器默认行为

jquery 事件对象介绍

• event.stopPropagation() //阻止事件冒泡
• event.preventDefault(); //阻止默认行为