第八章:使用jQuery操作DOM jQuery对javascript中的DOM操作进行封装jQuery中的DOM操作 1:样式操作 2:内容及value的操作 3:节点操作 4:节点属性操作 5:节点便利 6:css Dom操作 样式操作 设置单个样式css: .css("属性名称","属性值") 设置多个样式css: .css({"属性名称1":"属性值1","属性名称2":"属性值2"}) 获取样式值: .css("属性名称") 添加类样式: .addClass("属性名称") 移出类样式: .removeClass("属性名称") 切换类样式: .toggleClass("属性名称") 判断元素是否包含指定的样式 .hasClass("类样式名称") 内容及value值操作 获取元素中的html代码或文本代码 .html() 设置元素中的html代码或文本代码 .html(”******“) 获取元素中的文本内容 .text() 设置元素中的文本内容 .text(”******“) 元素失去焦点 .blur() 元素获得焦点 .focus() 获取元素的value属性值 .val() 设置元素的value属性值 .val(”*******“) 节点操作 获取和创建节点 工厂函数 $("") 通过选择器获取节点: $("selector") 把DOM节点转换为jQuery节点: $("<p>") 使用HTML字符串创建jQuery节点 $("<p>文字</p>") 元素内部追加子节点 将A节点追加到B节点里 ul.append(li); 将A节点追加到B节点里 li.appendTo(ul); 把A节点追加到B节点最前 ul.prepend(li) 把A节点追加到B节点最前 li.prependTo(ul) 元素外部插入到同辈节点 把A节点插入到B节点之后 B.After(A) 把A节点插入到B节点之后 A.insertAfter(B) 把A节点插入到B节点之前 B.before(A) 把A节点插入到B节点之前 A.insertBefore(A) 删除节点 删除h1节点 $("h1").remove() 清空h2节点 $("h1").empty() 替换节点 将A节点替换为B节点 span.replaceWith(div) 将A节点替换为B节点 div.replaceAll(span) 克隆节点: 克隆节点 $("selector").clone(true/false) 复制节点 参数为true复制事件 false不复制
用jQuery操作DOM
最新推荐文章于 2024-05-31 10:46:10 发布