1.寻找节点

//寻找节点 id方法

document.getElementById(); //标准

//寻找节点层次方法

parentNode()、firstChild()和lastChild();

-查找兄弟一个节点

previousSibling

-查找后一个节点

nextSibling

//根据签名查找节点

document.getElementsByTagName();返回数组

//根据name查找节点

getElementsByName();

2.创建一个新节点

//elementName:要创建的元素标签名 在返回创建的节点

var li= document.createElement("li");  这里创建了一个li节点

//设置节点信息

li.innerHTML="...";

//添加新的节点

-追加方式

var ul = document.getElementById("ul");

ul.appendChild(li) //像节点里面插入新创建的节点

ul.insertBefore(document.getElementById("li"),li) //插入其节点前面

3.删除节点

node.removeChild(child)

说明  child必须是node的子节点

DOM节点的基础操作的更多相关文章

  1. DOM节点(二):操作节点

    appendChild() 用于向childNodes列表的末尾添加一个节点. var returnedNode = someNode.appendChild(newNode); 如果传入的节点已经是 ...

  2. vue的数据双向绑定和ref获取dom节点

    vue是一个MVVM的框架 业务逻辑代码即js部分是model部分, html是view部分. 当model改变的时候,view也会改变 view 改变是,model也会改变 <template ...

  3. Vue 双向数据绑定、事件介绍以及ref获取dom节点

    vue是一个MVVM的框架 M model V view MVVM  model改变会影响视图view,view改变会影响model 双向数据绑定必须在表单里面使用 //我发现在谷歌浏览器翻译后的网页 ...

  4. 在页面上绘制一张表格,使用 DOM 节点的动态添加和删除向表格中插入数据,点击表格每行后的“删除”超链接

    查看本章节 查看作业目录 需求说明: 在页面上绘制一张表格,使用 DOM 节点的动态添加和删除向表格中插入数据,点击表格每行后的"删除"超链接,使用 DOM 节点的删除操作将对应的 ...

  5. Dom节点操作总结

    Dom   一:Dom的概念 Dom的简介:  全称为 document object model  文档对象模型,是操作文档的一整套方法 - 文档 - html,document时一个对象,是dom ...

  6. JavaScript DOM 基础操作

    JavaScript DOM 基础操作 一.获取元素的六方式 document.getElementById('id名称') //根据id名称获取 document.getElementsByclas ...

  7. 深入理解DOM节点操作

    × 目录 [1]创建节点 [2]插入节点 [3]移除节点[4]替换节点[5]复制节点 前面的话 一般地,提起操作会想到“增删改查”这四个字,而DOM节点操作也类似地对应于此,接下来将详细介绍DOM的节 ...

  8. 第6章 DOM节点操作

    一.创建节点 为了使页面更加智能化,有时我们想动态的在 html 结构页面添加一个元素标签,那么 在插入之前首先要做的动作就是:创建节点. varbox=$('<div id="box ...

  9. dom节点的操作

    dom节点的操作 -- jQuery 内部插入 1.(结尾)append 方法 . appendto方法(为了方便链式操作) (开头)prepend方法           $('#div1').ap ...

随机推荐

  1. MySQL累积求和

      有如下表 id money 1 10 2 20 3 30 4 40   求出如下数据 id money cum 1 10 10 2 20 30 3 30 60 4 40 100   建表 CREA ...

  2. ECMAScript 6 入门之变量的解构赋值

    1.数组 1. var a=1,b=2,c=3; console.log("a:",a) console.log("b:",b) console.log(&qu ...

  3. Selenium Web 自动化 - 项目实战环境准备

    Selenium Web 自动化 - 项目实战环境准备 2016-08-29 目录 1 部署TestNG  1.1 安装TestNG  1.2 添加TestNG类库2 部署Maven  2.1 mav ...

  4. 解决python-memcache报错:“Unknown flags on get: 20”

    [本文出自天外归云的博客园] 在使用python的pytho-memcache库时出现了一个问题,在调用get方法获取键值的时候报错:Unknown flags on get: 20 在网上查了,发现 ...

  5. GitStack 第三方开源服务器端

      GitStack 开源集成Git的界面服务器端 官网URL:http://gitstack.com     详情 请看<分布式版本控制系统Git--使用GitStack+TortoiseGi ...

  6. 对于Python中@property的理解和使用

    @property 这个我们在很多代码中都会用到,简单讲即为一个只读属性的调用 如果需要有修改权限,需要再加一个@属性名.setter 例: #!/usr/bin/env python # -*- c ...

  7. 1分钟了解MyISAM与InnoDB的索引差异

    版权声明:本文为博主原创文章,未经博主同意不得转载. https://blog.csdn.net/z50L2O08e2u4afToR9A/article/details/82111747 <数据 ...

  8. Cisco DHCP Snooping + IPSG 功能实现

    什么是DHCP? DHCP(Dynamic Host Configuration Protocol,动态主机配置协议)是一个局域网的网络协议,前身是BOOTP协议, 使用UDP协议工作,常用的2个端口 ...

  9. 【转】在xcode5中修改整个项目名

    本文转载自:http://www.cnblogs.com/tbfirstone/p/3601541.html 总会遇到几个项目,在做到一半的时候被要求改项目名,网上找了下相关的资料,大多数是xcode ...

  10. Mac获取公网ip

    终端输入 curl http://members.3322.org/dyndns/getip way 2: ➜ ~ wget http://ipecho.net/plain -O - -q ; ech ...