jquery对JavaScript中的DOM操作金项链封装jQuery中的DOm操作
样式操作
设置单个样式: .css("属性名称","属性值")
设置多个样式: .css({"属性名称1":"属性值1","属性名称2":"属性值2"})
获取样式值: .css("属性名称")
添加类样式: .addClass("类样式名称")
移除类样式: .removeClass("类样式名称")
切换类样式: .addClass("类样式名称")
内容及value值操作
获取元素中的html代码或文本代码 .html()
设置元素中的html代码或文本代码 .html("<h1>我真帅</h1>")
获取元素中的文本内容 .text()
设置元素中的文本内容 .text("我真帅")
元素失去焦点 .blur()
元素获得焦点 .fucos()
获取元素的value属性值 .val()
设置元素的value属性值 .val("设置的属性值")
节点操作
工厂函数$("")
获取或创建节点 $("")
通过选择器获取节点:$("selector") $("selector")
把DOM节点转换为jQuery节点: $("<p>")
使用HTML字符串创建jQuery节点 $("<p>文字</p>")
元素内部追加子节点
to:到/给予
将A节点追加到B节点里 B.append(A);
将A节点追加到B节点里 A.appendTo(B);
$(function (){
// 获取元素中的html代码或文本代码 .html()
console.log($("father").html());
// 设置元素中的html代码或文本代码 .html("<h1>我真帅</h1>")
$("#father").html("<h1>我真帅</h1>");
// 获取元素中的文本内容 .text()
// 设置元素中的文本内容 .text("我真帅")
// 元素失去焦点 .blur()
$("input")
// 元素获得焦点 .focus()
// 获取元素的value属性值 .val()
console.log()
// 设置元素的value属性值 .val("设置的属性值")
$(this).val("请输入XXX")
})