第三章中主要讲了几个对DOM进行操作的方法。

归纳如下:

  属性的获取和设置:

//属性的获取
$("li").attr("title");
//属性的设置
$("li").attr("title","test");
//批量属性的设置
$("li").attr({"title":"test","id":"test2"......});

删除属性:

$("p").removeAttr("title");

创建节点:

  这个很好玩,完全就是直接写html代码就好

$("<b title = "xxx">xxx</b>")

插入节点:

  这个就臭又长了~而且很好玩,他找到几个插几个找一个标签p,找到100个他就插100个,

直接在p的内部插入,插到最后面。

$("p").append($("<b>xxx</b>"));

将$txt插到p1内部,注意语法,是前插后

var $txt = $("<b>World</b>");
$txt.appendTo("#p1");

prepend()查到元素内部前面

$("p").prepend($("<b>xxx</b>"));

prependTo()前面的元素插到后面元素内部前面

after()插到指定元素之后(同级)

insertAfter()前插后

before()插到指定元素之前(同级)

insertBefore()前插后

删除节点:

这个简单,找到节点,一个remove()

$li = $(ul li:eq(0)).remove();

但是他会返回一个删除掉的子节点哦。

删除子节点

empty()

$(ul li:eq(0)).empty

注意,其中的文字也算子节点哦

复制节点

$(ul li:eq(0)).clone()
//其中如果clone(true)的话可以连里面的事件一起复制

替换节点:

$("p").replaceWith("<b>xxx</b>");
//或者
$("<b>xxx</b>").replaceAll("p")

包裹节点:

将已有的节点用其他标签包裹起来:如:<b>xx</b>包裹一个p:<p><b>xxx</b></p>

$("b").wrap("<p></p>");

但是这个只能包裹单个如果相同的标签有一堆,他会一个个包裹起来

所以有了:wrapAll()

$("strong").wrap("<b></b>");

多个的就被一个包裹起来了。

样式操作:

除了传统的属性设定指望,还有有addClass(),追加样式

找到元素,使用addClass("样式名");即可在原有样式后空格再来一个样式

移除样式removeClass("样式名");

获取html内容:类似innerHTML

$("#p1").html()

获取text内容:类似innerText

$("p").text();

获取value值,在选择之类的地方很好用哦

$("single").val();//获取值
$("single").val("1");//指定值

遍历DOM:

.children()方法,遍历指定元素下子节点

next()下一个同级节点

prev();上一个同级节点

siblings();获取所有同级元素

css操作:

获取节点,然后进行css设定:

$("P").css("color":"red","backgroundColor":"blue")

好记心不如烂笔头之JQuery学习,第三章的更多相关文章

  1. 好记心不如烂笔头之JQuery学习,第二章

    jQuery获取元素不需要担心元素不存在而报错,但是无论怎样 $("#xxx") 是一定会有返回值的,无论存不存在元素,那么依然是要对元素做判断的,判断的方法常见两种 1.看返回的 ...

  2. 好记心不如烂笔头之JQuery学习,第四章

    ---恢复内容开始--- JQuery中的事件和动画 JQuery中的事件: $(document).ready()该事件和JS中的window.load类似,但是window.load中需要等待所有 ...

  3. 好记心不如烂笔头之jQuery学习,第一章

    jQuery对象和DOM对象的转换: 1.jquery对象是对象数组,于是乎: var $cr = $('#cr'); var cr = $cr[0]; 2.使用jquery的自带函数: var $c ...

  4. 好记心不如烂笔头,ssh登录 The authenticity of host 192.168.0.xxx can't be established. 的问题

    用ssh登录一个机器(换过ip地址),提示输入yes后,屏幕不断出现y,只有按ctrl + c结束 错误是:The authenticity of host 192.168.0.xxx can't b ...

  5. 好记心不如烂笔头,ssh登录 The authenticity of host 192.168.0.xxx can&#39;t be established. 的问题

    用ssh登录一个机器(换过ip地址),提示输入yes后,屏幕不断出现y,仅仅有按ctrl + c结束 错误是:The authenticity of host 192.168.0.xxx can't ...

  6. jQuery系列 第三章 jQuery框架操作CSS

    第三章 jQuery框架操作CSS 3.1 jQuery框架的CSS方法 jQuery框架提供了css方法,我们通过调用该方法传递对应的参数,可以方便的来批量设置标签的CSS样式. 使用JavaScr ...

  7. jquery学习笔记(三):事件和应用

    内容来自[汇智网]jquery学习课程 3.1 页面加载事件 在jQuery中页面加载事件是ready().ready()事件类似于就JavaScript中的onLoad()事件,但前者只要页面的DO ...

  8. [jQuery学习系列三 ]3-JQuery学习二-字典操作

    前言:如果看过了第一篇和第二篇, 相信大家会对jQuery有个初步的认识了, 对于jQuery的选择器和数组的操作都已经很熟悉了, 这一篇就单独罗列jQuery中字典的操作相关的内容. 1. 数组中添 ...

  9. Jquery学习(三)选择

    1.Jquery最重要的是选择. 学习要点:        1.简单选择器        2.进阶选择器        3.高级选择器 ①简单选择器. 最简单的也就是最经常使用的,最经常使用的一般也是 ...

随机推荐

  1. public static void main(String arg[])

      该语句定义了main方法. main方法是程序执行的入口,所有的java程序都必须具备一个main()方法,而且必须按照如上的格式来定义. 不具有main方法的类可以编译,但不能执行.因为它没有m ...

  2. gem 相关命令

    gem #查看gem源 gem sources # 删除默认的gem源 gem sources --remove http://rubygems.org/ # 增加taobao作为gem源 gem s ...

  3. 第二百零六天 how can I 坚持

    今天爬了趟香山,第三次去了,要征服北京这大大小小的山. 要征服三山五岳,然后...罗娜.哈哈. 爬了趟山好累,人好多. 我的铜钱草. 洗刷睡觉,还是明天给鱼换水吧,好懒.

  4. RFID第二次作业

    1.简述智能卡的发展,以及射频电子标签在其中所处的位置. 智能卡(Smart Card)又称为集成电路卡(IC卡),内部带有微处理器和存储单元等部件. 射频电子标签是一种非接触式的IC卡,是后期发展起 ...

  5. 关于Windows Azure 地缘组(Affinity Groups)

    最近在和一些客户和朋友的沟通中,发现Windows Azure地缘组概念很少有了解.我的建议是使用地缘组来优化同一区域内的网络访问速度.如果我的说法有误,欢迎大家指正. 关于“地缘组”的概念(摘自MS ...

  6. 恢复HDFS误删数据

    [恢复HDFS误删数据] HDFS会为每一个用户创建一个回收站目录:/user/用户名/.Trash/,每一个被用户通过Shell删除的文件/目录,在系统回收站中都一个周期,也就是当系统回收站中的文件 ...

  7. #用Python直接写UTF-8文本文件

    当我们这样建立文件时 f = file('x1.txt', 'w') f.write(u'中文') f.colse() 直接结果应该是类似 f.write(u'中文') UnicodeEncodeEr ...

  8. pureMVC学习之一

    //1var  MainWindow: TMainWindow;begin  Application.Initialize;  Application.MainFormOnTaskbar := Tru ...

  9. [SQL]sql语句bug

    sql语句格式必须严格检查,一个空格的错误都会导致执行错误. 常见有 1:字符串的值要用  ‘  ’  括起来 2:用 , 分隔语句段 3:切记判断条件前有一空格:eg:这里最容易出错 4:属性名是否 ...

  10. HDU 3696 Farm Game(dp+拓扑排序)

    Farm Game Problem Description “Farm Game” is one of the most popular games in online community. In t ...