原文链接:http://www.cnblogs.com/william-lin/archive/2012/08/12/2635402.html

介绍
   DOM是Document Object Modeule的缩写,一般来说,DOM操作分成3个方面。
  1、DOM Core
    DOM Core并不专属于javascript,任何一种支持DOM的程序设计语言都可以使用它,用途也远不止仅限于网页,也可以用来处理任何一种使用标记语言编写出来的文档,如XML。
    例如:document,getElementsByTagName(“form”);//使用DOM Core来获取表单对象的方法。
  2、HTML-DOM
    在使用Javascript和DOM为HTML文件编写脚本时,有许多属于HTML-DOM的属性,HTML-DOM的出现甚至比DOM Core还要早,他提供了一些更简明的记号来描述各种HTML元素的属性。
    例如:document.forms //HTML-DOM提供了一个forms对象。
  PS:可以看出,获取对象、属性即可以用DOM Core来实现民,也可以用HTML-DOM实现。
  3、CSS-DOM
     CSS-DOM是针对CSS的操作,在javascript中,CSS-DOM主要的作用是获取和设置style对象的各种属性,由此达到网页呈现出各种不同的效果.
    例如:element.style.color=”red”;//设置某元素的字体颜色的方法。
常用方法
   1.查找元素节点
     var $li = $(“ul li:eq(0)”);//获取ul标记下的第一个li,也可以写成 $(“#ulID li:eq(0)”);
   2.查找元素属性
   利用jquery的attr()方法来获取元素的各种属性的值,attr()方法的参数可以是一个,也可以是两个。
         当参数是一个时,则是要查询的属性名称。
         当参数是两个时,则可以设置属性的值。
      alert($(“#id”).attr(“title”)); //输出元素的title属性.一个参数
      $(“#id”).attr(“title”,”改变title值”); //改变元素的title属性值.二个参数
   3.添加元素节点
      $(html) 简单说明一下$(html)方法会根据传入的html标记字符串创建一个dom对象,并将这个dom对象包装成一个jquery对象返回,总之就是把标记所有html代码都放到$()工厂里面就行了!
      例:
         var $htmlLi = $(”  <li title=’香蕉’>香蕉</li>”);  //创建DOM对象
         var $ul = $(“ul”);   //获取UL对象
         $ul.append($htmlLi); //将$htmlLi追加到$ul元素的li列表
  4.删除元素节点

   由于我们需要经常动态去改变DOM元素,因此Jquery提供了两种删除节点的方法,即remove()和empty();
    4.1 remove()方法
     $(“p”).remove();//    我们可以获取到要删除的元素,然后调用remove()方法
     $(“ul li:eq(0)”).remove().appendTo(“ul”);// 删除ul下面的第一个li标记,然后再把删除的li标记重新加到ul里面,remove()方法返回删除元素的引用,这时你可以继续使用
     $(“ul li”).remove(“li[title!=ABC]“);//remove可以接受通过参数来选择性的删除符合条件的元素;
   4.2 empty()方法
     严格来讲,empty()方法并不是删除元素,而是清空
     例:
      HTML代码
       <ul>
          <li title=”AAA”>AAA</li>
       </ul>
      JQuery代码
       $(“ul li:eq(0)”).empty();
      结果
      <ul>
          <li title=”AAA”></li>
       </ul>
      记住,只会清空内容,不会请空属性;

Jquery元素追加和删除的更多相关文章

  1. jquery元素插入、删除、清空

    1)jquery元素插入 <!--位置1--> <div id='test'> <!--位置2--> <div>测试</div> <! ...

  2. jquery元素插入、删除、清空、找父子级元素

    1)jquery元素插入 <!--位置1--> <div id='test'> <!--位置2--> <div>测试</div> <! ...

  3. JavaScript(20)jQuery HTML 加入和删除元素

    jQuery - 加入元素 通过 jQuery,能够非常easy地加入新元素/内容. 加入新的 HTML 内容的四个 jQuery 方法: append() - 在被选元素的结尾插入内容 prepen ...

  4. jquery 元素控制(追加元素/追加内容)

    参考网址:http://www.jquerycn.cn/a_5521 一.在元素内部/外部追加元素 append,prepend:添加到子元素 before,after:作为兄弟元素添加 html: ...

  5. jquery 元素控制(追加元素/追加内容)介绍及应用

    http://blog.csdn.net/gisredevelopment/article/details/41126533 一.在元素内部/外部追加元素 append,prepend:添加到子元素  ...

  6. javascript 常见数组操作( 1、数组整体元素修改 2、 数组筛选 3、jquery 元素转数组 4、获取两个数组中相同部分或者不同部分 5、数组去重并倒序排序 6、数组排序 7、数组截取slice 8、数组插入、删除splice(需明确位置) 9、数组遍历 10、jQuery根据元素值删除数组元素的方)

    主要内容: 1.数组整体元素修改 2. 数组筛选 3.jquery 元素转数组 4.获取两个数组中相同部分或者不同部分 5.数组去重并倒序排序 6.数组排序 7.数组截取slice 8.数组插入.删除 ...

  7. JQuery 数组获取和删除元素

    <script> var target = []; target [0] = "aaa000"; target [1] = "bbb111"; ta ...

  8. jquery 添加与删除的规律 当要添加时候要定位到自己的父元素 当要删除时候 通过事件函数传入的this找到自己的父元素进行删除

    jquery 添加与删除的规律 当要添加时候要定位到自己的父元素  当要删除时候 通过事件函数传入的this找到自己的父元素进行删除

  9. jquery操作html元素之(删除元素)

    删除元素/内容 如需删除元素和内容,一般可使用以下两个 jQuery 方法: remove() - 删除被选元素(及其子元素) empty() - 从被选元素中删除子元素 jQuery remove( ...

随机推荐

  1. netstat -ano,查看已占用端口,结束已被占用的端口,ntsd,关闭任务管理器杀不了的进程

    cmd——回车,输入netstat -ano——回车,可以查看已占用的端口,记下端口的PID,然后打开任务管理器,点查看,选择列,勾选PID确定,找到对应的PID,结束进程,如果结束不了或者结束后还不 ...

  2. JavaScript经典代码【二】【javascript判断用户点了鼠标左键还是右键】

    IE 下 onMouseDown 事件有个 events.button 可以返回一个数值,根据数值判断取得用户按了那个鼠标键 events.button==0 默认.没有按任何按钮. events.b ...

  3. 常用ADB命令

    adb devices          查看当前已与pc端连接的设备序列号 adb install -r   +apk名称     安装应用程序(带-r参数表示强制安装,可以覆盖安装) adb un ...

  4. Sbt的使用初步和用sbt插件生成eclipse工程

    以前一直是用maven去管理java项目,现在开始写scala项目了但是在scala-ide中去编译scala项目和sbt的区别一直没弄清楚受到文章:http://my.oschina.net/yjw ...

  5. FLASH CC 2015 CANVAS 中 gotoAndStop、gotoAndPlay() 不起作用

    哎 话不多说先看我的代码: //舞台上 放着sp0.sp1....sp8,9个mc,每个mc都有几帧, //帧上有如下代码 var S=this; S.stop() inIt1();//not wor ...

  6. 关于ListView嵌套GridView中的onItemClickListener失效问题

    一开始在ListView中设置了onItemClickListener,在里面Log输出Item列表的位置,完全没有反应, 网上大部分说的什么把子组件屏蔽掉(而且好多都是转载的一样的), 可是我希望的 ...

  7. Scrum Meeting---Ten(2015-11-5)

    今日已完成任务和明日要做的任务 姓名 今日已完成任务 今日时间 明日计划完成任务 估计用时 董元财 分类页设计 4h 商品详单设计 4h 胡亚坤 首页设计 2h 滚动广告栏设计 2h 刘猛 服务器测试 ...

  8. Maven测试

    生命周期阶段需要绑定到某个插件的目标才能完成真正的工作,test阶段正是与maven-surefire-plugin的test目标相绑定了,这是一个 内置的绑定. 在默认情况下,maven-suref ...

  9. OC面向对象及继承

    1. 面向对象它通过给程序中加入扩展语句,把函数“封装”进编程所必需的“对象”中.面向对象的编程语言使得复杂的工作条理清晰.编写容易.说它是一场革命,不是对对象本身而言,而是对它们处理工作的能力而言. ...

  10. 2年后的Delphi XE6

    1.有幸下载到Delphi XE6,下载地址如下: http://altd.embarcadero.com/download/radstudio/xe6/delphicbuilder_xe6_win. ...