一、文本内容的操作
方法:①text() ②text(val)
例子:$div = $(‘div’) //获取div元素
Console.log($div.text()) //获取文本内容
$div.text(“aaaaa”) //设置了文本的内容
二、HTML内容的操作
①html():用于获取第一个匹配元素的HTML内容
②html(val):用于设置全部匹配元素的HTML内容
注意:内容中包含HTML代码可以被浏览器解析
三、对元素值的操作
主要对于input、check、radio元素
①val() //获取值
②val(“”) //设置值
四、对于DOM节点的操作
①创建元素节点:
Var $jsp = $(“<p></p>”) //创建了一个p节点
插入到div里面
$(“div”).append($jsp)
②插入节点:
方法:1)往元素的内部插入
append():为所有匹配的元素的内部追加内容
appendTo():将所有匹配的元素添加到另一个元素集合中
prepend():往元素的集合的前面添加内容
prependTo()
2)往元素的外部插入
after():在每个匹配的元素之后插入
insertAfter():
before():在每个匹配的元素前边插入
insertBefore()
③删除节点:
remove():用于从DOM中删除匹配的元素(常用)
detach():也是用于删除匹配的元素,与remove不同的是,detach不会将jQuery中的对象删除。
empty():把标签的内容清空掉,不是绝对意义上的删除
④复制节点
clone():
示例:$(“#box1 p:eq(1)”).bind(“click”,function(){
$(this).clone().insertAfter($(this))
})
带参数:clone(True):加了这样之后会将事件处理程序一并复制
⑤替换节点
replaceAll(Seletor):用于使所有的元素替换掉Seletor匹配的元素
示例:$(“<div>good</div>”).replaceAll(“div”)
replaceWith(content):用匹配的元素替换掉指定的HTML元素
示例:$(“#box1”).replaceWith(“<div>sunck</div>”)
⑥遍历节点
each():
示例:
$(“p”).each(function(index){ //index表示第几个
$(this).attr(“title”,”我是第”+(index+1)+”个p标签”)
})
⑦包裹节点:
wrap():把匹配到的标签用另一个标签包裹起来
unwarp():去除包裹
warpAll():整体包裹
warpInner():包裹内部
五、修改CSS样式
addClass(class)
removeClass(class)
toggleClass(class):若有这个class类就删除,若无就添加
六、修改CSS的属性
方法:css(attr,value)
示例:
$(“#btn”).bind(“click”,function(){
$(“#box2”).css(“background-color”,”red”) //修改背景颜色的属性
console.log($(“#box2”).css(“background-color”)) //获取值
})