首页 > 代码库 > jquery中的节点的操作
jquery中的节点的操作
节点的操作
Dom 文档对象 模型 解决
一.插入节点
Append() 在每个匹配的元素中追加内容
Var $li_1= “<li></li>”;
Var $li_2 =”<li></li>”
$(“ul”).append($li_1).append($li_2); //添加到ul中rep
appendTo() 将所有匹配元素追加到指定元素中
$(“<b>asd</b>”).appendTo(p); p 指<p></p>you
Prepend() 向每个匹配元素的内部前置内容
PrepenTo()将所有的匹配的元素前置到指定元素中
After() 在每个匹配元素后面插入内容
insertAfter ()将匹配的元素插到指定元素的后面
before() 在每个匹配元素前面插入元素
insertBefore()将匹配的元素插到指定元素的前面
二.DOM元素的插入与移动
InsertBefore()
insertAfter()
三.删除节点
Remove()
empty() 用于清除节点的文本 $("#p").empty()
四.复制节点
Clone() 复制节点 有一个参数 或无参数
五.替换节点ReportedWith()与ReplaceAll()的作用一样,替换的事件一样会消失
ReplaceWith(“<string>被替换新的文本</strign>”)
(“<string>被替换新的文本</strign>”).replaceAll();
六.包裹节点 将某一节点用其他的标签包裹起来 用wrap();方法实现的
Wrap() WrapAlll() wrapInner() 能够包裹节点;
$(“p”).wrap(“<b></b>”)用<b>标签把<p>元素包裹起来
Wrap(); 用于在文档插入而外的结构化标签 ,不会破坏其语义 例:
$(“p”).wrap(“<b></b>”) //用b标签将p包裹起来 ,效果将p的文本的字体加粗
Wrapall(); 将所有匹配的元素用一个元素包裹起来,不同于
Wrapinner(); 是将每一个匹配的子元素的子内容{包括文本节点},用其他结构化的标签包裹起来
属性的操作
attr()属性的操作或设置
根据属性名称获取属性的值,如:(“元素名”).attr(“title”);//获取属性的title的值
设置属性的值 (“属性名”).attr(“属性名”:”属性值”);///设置属性的值,如果有多个用逗号隔开
removeAttr()删除属性//有参数,是指定的属性名删除,没参数删除所有的属性
追加样式
addClass()的方法追加样式
addClass() 追加样式 在调用一次addclass()
而Attr();会把前面的样式替换掉
removeClass()删除样式 带参数指定样式删除 删除多个用空格隔开 如果没有删除全部
切换样式
Toggle()交替一组动作
StoggleBtn.toggle( function()
{ //显示元素的代码
},function(){
//隐藏的代码
})
/// jquery 提供一个toggleClass(); 方法控制样式的重复切换 一个参数 : class的名称
ToggleClass() 进行显示/隐藏的切换
Toggle() ///无参数是默认是样式的切换
HasClass()可以用来判断元素是否含有摸个class,如果有返回true,如歌没有 false
Html()//以html文本解析后输出;
Text() //以普通的文本输出
Next();//用于获取同辈的下一个元素
Height(0 wicdth() vla() css()……的用法差不多
Chiildren()获取所有匹配元素的子元素集合
Prev() 用于获取同辈紧邻的上一个元素
Siblings() 匹配同辈的所有的元素,不包括自己
Closest() 匹配 最近的元素,如果自己不匹配,往上“父元素”匹配,一级一级的匹配,如果匹配
scrollTop() scrollleft() 滚动条的操作
jquery中的节点的操作