节点的操作

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中的节点的操作的更多相关文章

  1. JavaScript jQuery 中定义数组与操作及jquery数组操作

    首先给大家介绍javascript jquery中定义数组与操作的相关知识,具体内容如下所示: 1.认识数组 数组就是某类数据的集合,数据类型可以是整型.字符串.甚至是对象Javascript不支持多 ...

  2. JavaScript jQuery 中定义数组与操作及jquery数组操作 http://www.jb51.net/article/76601.htm

    首先给大家介绍javascript jquery中定义数组与操作的相关知识,具体内容如下所示: 1.认识数组 数组就是某类数据的集合,数据类型可以是整型.字符串.甚至是对象Javascript不支持多 ...

  3. js进阶 11-3 jquery中css属性如何操作

    js进阶 11-3  jquery中css属性如何操作 一.总结 一句话总结:通过css()方法 1.attr和css是有交叉的,比如width,两者中都可以设置,那么他们的区别是什么? 其实通俗一点 ...

  4. js进阶 11-1 jquery中的页面内容操作的三个方法

    jquery中的页面内容操作的三个方法 一.总结 一句话总结:记三个方法即可.text,html,val.因为这里是方法,所以设置值的是后面方法的参数. 1.jquery中的页面内容操作的三个方法? ...

  5. JavaScript&&jQuery创建新节点和操作属性对比

    JavaScript创建新节点和操作属性 通过JavaScript原生接口创建节点,在处理上是非常复杂与繁琐的. <!DOCTYPE html> <html lang="e ...

  6. jQuery中 对标签元素操作(2)

    一.属性操作 1.获取属性和设置属性 例如下jQuery代码: var $para=$("p");           //获取<p>节点 var p_txt=$par ...

  7. jquery中对 iframe的操作

    我们先看一下 JQUERY中的对像 contents() 的帮助文件 contents() 概述 查找匹配元素内部所有的子节点(包括文本节点).如果元素是一个iframe,则查找文档内容 示例 描述: ...

  8. jQuery中的文档操作处理(五):append()、prepend()、after()、before()、wrap()、wrapAll()、wrapInner()、clone()等

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <hea ...

  9. jquery 中json数组的操作(转)

    在jquery中处理JSON数组的情况中遍历用到的比较多,但是用添加移除这些好像不是太多. 今天试过json[i].remove(),json.remove(i)之后都不行,看网页的DOM对象中好像J ...

随机推荐

  1. C#和VC++字符集和编码

    C# char 关键字用于声明 .NET framework 使用 Unicode 字符表示 System.Char 结构的实例. Char 对象的值是 16 位数字 (序号值.)将字符表示为 UTF ...

  2. passport 自动取密码

    django settings.py """ Django settings for password project. Generated by . For more ...

  3. iOS - (两个APP之间的跳转)

    一个程序若要跳到另一个程序.需要在目标程序的plist文件里面修改: 打开info.plist,添加一项URL types 展开URL types,再展开Item0,将Item0下的URL ident ...

  4. "provider: 命名管道提供程序, error: 40 - 无法打开到 SQL Server 的连接"错误的解决方法

    这个错误主要有以下几个原因造成: 1. 错误的连接字符串:例如数据源的实例名称“\"错误写成"/"了 2.Named Pipes(NP)没有启动 其他原因,详见:http ...

  5. lua对模块接口扩展的一种方法

    module lua中模块的实现,对于使用者来说就是一个库,引用此库后,可以调用库中实现的任意函数. 使用库,可以将一类功能相关的接口做封装,并提供开放接口. 参考: http://blog.codi ...

  6. electron "Cannot find module 'dialog'", source: module.js (336)"

    打算用electron的dialog api 谁知道, 按官方api http://electron.atom.io/docs/v0.33.0/api/dialog/ https://github.c ...

  7. chrome 下载插件包及离线安装

    最近需要测试http rest服务,由于chrome插件的轻便,首先想到了用chrome插件,在google商店找到Advanced Rest Client,用了一阵感觉不错. 于是项目组其他同事也要 ...

  8. IDEA中 @override报错的处理步骤

    今天用IDEA导入一个java工程时,JDK1.8版本,碰上一个问题,代码中所有@override处标红,并提示:@override不支持对接口的实现. 网上百度了一下发现, 原因是引用JDK5版本中 ...

  9. devexpress13学习系列(一)PDFViewer(2)

    DevExpress.XtraPdfViewer Namespace 该命名空间下,保留着pdfviewer组件需要的类,主要有:   Class Description   PdfCurrentPa ...

  10. PostgreSQL Cascade Replication

    PostgreSQL Cascade Replication node1:master:10.2.208.10:repclia(user) node2:upstreamnode:10.2.208.11 ...