玩遍jquery

$("#test").html()意思是指：获取ID为test的元素内的html代码。其中html()是jQuery里的方法

这段代码等同于用DOM实现代码：document.getElementById("test").innerHTML;

虽然jQuery对象是包装DOM对象后产生的，但是jQuery无法使用DOM对象的任何方法，同理DOM对象也不能使用jQuery里的方法.乱使用会报错

约定：如果获取的是jQuery对象,那么要在变量前面加上$.

var$variable=jQuery对象

varvariable=DOM对象

基本语法：$(selector).action()

二寻找元素(重要的选择器和筛选器)

2.1选择器

2.1.1基本选择器$("*")$("#id")$(".class")$("element")$(".class,p,div")

2.1.2层级选择器$(".outerdiv")$(".outer>div")$(".outer+div")$(".outer~div")

2.1.3基本筛选器$("li:first")$("li:eq(2)")$("li:even")$("li:gt(1)")

2.1.4属性选择器$(‘[id="div1"]‘)$(‘["alex="sb"][id]‘)

2.1.5表单选择器$("[type=‘text‘]")----->$(":text")注意只适用于input标签

$("input:checked")

2.2筛选器

2.2.1过滤筛选器

$("li").eq(2)$("li").first()$("ulli").hasclass("test")

2.2.2查找筛选器

$("div").children(".test")$("div").find(".test")

$(".test").next()$(".test").nextAll()$(".test").nextUntil()

$("div").prev()$("div").prevAll()$("div").prevUntil()

$(".test").parent()$(".test").parents()$(".test").parentUntil()

$("div").siblings()

实例左侧菜单

3.1属性操作

$("p").text()$("p").html()$(":checkbox").val()

$(".test").attr("alex")$(".test").attr("alex","sb")

$(".test").attr("checked","checked")$(":checkbox").removeAttr("checked")

$(".test").prop("checked",true)

$(".test").addClass("hide")

实例编辑框正反选

3.2.1(样式)css("{color:‘red‘,backgroud:‘blue‘}")

3.2.2(位置)offset()position()scrollTop()scrollLeft()

3.2.3(尺寸)height()width()

实例返回顶部

内部插入$("#c1").append("hello")$("p").appendTo("div")

prepend()prependTo()

外部插入before()insertBefore()afterinsertAfter()

replaceWith()remove()empty()clone()

实例clone方法的应用

+