原文链接: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. 获取元素的xpath, 转换xpath为csspath进行jQuery元素获取

    获取元素的xpath, 转换xpath为csspath进行jQuery元素获取 博客分类: 编程心得 jQueryCSSHTML  var $shadow = new Object(); /** 获取 ...

随机推荐

  1. Light OJ 1026 - Critical Links (图论-双向图tarjan求割边,桥)

    题目大意:双向联通图, 现在求减少任意一边使图的联通性改变,按照起点从小到大列出所有这样的边 解题思路:双向边模版题 tarjan算法 代码如下: #include<bits/stdc++.h& ...

  2. python singleton

    方法一:用元类的方式实现一个singleton. liuxiaoyan@development:~/mysite$ cat Singleton.py class Singleton(type): &q ...

  3. cookie注入讲解

    我们首先还是来看看中网景论坛的最新版本"(CNKBBS2007)中网景论坛2007v5.0 "官方下载地址" http://www.cnetking.com/websys ...

  4. function设置jsp页面使用js控制文本框只读,并且按下backspace删除按钮后停在原页面

    最近一直在学习function设置之类的问题,现在正好有机会和大家分享一下. 设置只读 document.getElementById("projcode").setAttribu ...

  5. subsets-ii(需要思考,包括了子数组的求法)

    还是有一定难度的. 基本方法,就是用队列,然后不断累加新的数.这是为了不重复而量身定制的. 如果运行重复,是有更简单清晰的方法,就是每次增加考虑一个数字,然后加到本来每一个结果的后面.如下: publ ...

  6. MemSQL Start[c]UP 2.0 - Round 2

    反正晚上睡不着,熬到1点开始做比赛,6个题目只做了2个题目,而且手速还比较慢,待提升空间还很大呢. A题:给定两个0,1串(len<=100000), 但是不是普通的二进制串,而是q进制串,q ...

  7. id有空格获取不到元素

  8. 正则表达式及re模块

    正则表达式使用的特殊符号与字符 元字符 描述 \ 将下一个字符标记符.或一个向后引用.或一个八进制转义符.例如,“\\n”匹配\n.“\n”匹配换行符.序列“\\”匹配“\”而“\(”则匹配“(”.即 ...

  9. BOM基础(一)

    学完了js的基础语法和DOM之后,就要要看看javascript中最后一项BOM了.BOM,全称brower document model,翻译过来就是浏览器对象模型.DOM是文档对象模型,属于BOM ...

  10. 【HTML】table元素

    1.最简单的table <table> <tr> <th></th> </tr> <tr> <td></td& ...