jQuery对JavaScript中的DOM操作进行了封装jQuery中的DOM操作
1:样式操作 2:内容及value值操作 3:节点操作
样式操作
设置单个样式: .css("属性名称","属性值"); 设置多个样式: .css({"属性名称1":"属性值","属性名称2":"属性值"}); 获取样式值: .css("属性名称"); 添加类样式: .addClass("类样式名称 类样式名称"); 移除类样式: .removeClass("类样式名称 类样式名称"); 切换类样式: .toggleClass("类样式名称"); 判断元素是否包含指定的样式 .hasClass("类样式名称 类样式名称");
内容及value值操作
获取元素中的Html代码 .html(); 设置元素中的Html代码 .html("<h1>我最帅!</h1>"); 获取元素中的文本内容 .text(); 设置元素中的文本内容 .text("我最帅!"); 元素失去焦点: .blur(); 元素获得焦点: .focus(); 获取元素的value属性值 .val(); 设置元素的value属性值 .val("设置的属性");
节点操作
获取或创建节点 工厂函数 $("") 通过选择器获取节点: $("selector"); 把DOM节点转换为jQuery节点: $("<h1>"); 使用HTML字符串创建jQuery节点: $("<p>文字</p>"); 元素内部追加子节点 to:到 将li节点追加到ul节点里 ul.append(li); 将li节点追加到ul节点里 li.appendTo(ul); 把li节点追加到ul节点最前 ul.prepend(li); 把li节点追加到ul节点最前 li.prependTo(ul); 元素外部插入同辈节点 把li节点插入到ul节点之后 ul.after(li); 把li节点插入到ul节点之后 li.insertAfter(ul); 把li节点插入到ul节点之前 ul.before(li); 把li节点插入到ul节点之前 li.insertBefore(ul); 删除节点: 删除h1节点 $("h1").remove(); 清空h2节点 $("h2").empty(); 替换节点: 将A节点替换为B节点 A.replaceWith(B); 将A节点替换为B节点 A.replaceAll(B); 克隆节点: 克隆节点: $("selector").clone(true/false) 复制节点,参数为true复制事件,false则不复制事件。