DOM(增删改查);

查询

1.获取元素
1.1标准DOM API
document.getElementById
document.getElementsByTagName
document.getElementsByName
document.getElementsByClassName
document.querySelectorAll
1.2亲属访问
1.3属性获取
getAttribute
getAttributeNode
2.获取属性值
var attrNode=node.getAttributeNode("属性名");
attrNode.nodeValue;
//简化
node.gatAttribute("属性名")

增加

1.创建
document.createElement创建元素节点
document.createTextNode创建文本节点
document.createAttribute属性节点
innerHTML
innerText
cloneNode
2.加入
appendChild追加到结尾处
innerHTML
insertBefore将元素插入到某一个元素的前面
列:父元素.insertBefore(新元素,旧元素);
//将新元素插入到旧元素的前面

删除

        1.删除元素
removeChild
removeAttributeNode
1.2删除子元素
//从node中删除一个div
node.removeChild(div);
//如果div变量不存在
var div=document.getElementById("...");
node.removeChild(div);
//假设node节点中只有一个元素div
node.innerHTML="";
2.删除属性
**创建时,里面属性名一定要加双引号;添加时,里面的属性一定不要加双引号。
var attrNode=node.getAttributeNode("属性名");

修改

       1.修改节点
删除节点再加入
2.修改样式
style.xxx=vvv;
setAttribute;
3.修改文本
innerHTML
innerText
节点操作
nodeValue
4.修改属性
.xxx=vvv
setAttribute

对面字面量和json对象的区别

json对象有两种说法:一种是传统的json对象,一个是符合json协议的对象 符合json协议的对象要求所有的属性名必须带有引号,表示字符串 所有的键必须使用双引号括起来 、、、 html首尾换行的字节点不算

proto

以前要访问原型,必须使用构造函数来实现,无法直接使用实例对象来访问原型。 火狐最早引入属性proto表示使用实例对象引用原型。但是早期是非标准的。通过该属性可以允许使用实例对象直接访问原型 function Person(){} //神秘对象那个就是Person.prototype //那么只有使用构造函数 才可以访问它 var o=new Person(); //以前不能直接使用o来访问神秘对象 //现在有了proto后 //o.proto也可以直接访问神秘对象(两个下划线) //那么o.proto===Person.prototype 1.神秘对象中默认都有一个属性constructor,翻译为构造器。表示该原型是与什么构造函数练习起来的。 2.proto有什么用? .可以访问原型 .由于在开放中除非特殊要求,不要使用实例去修改原型的成员。因此属性开发时使用较少。 .但是再调试过程中非常方便,可以轻易的访问原型进行查看成员。 3.如果在早期的浏览器中使用实例需要访问原型如何处理? .可以使用实例对象访问构造器,然后使用构造器访问原型 var o=new Person(); o.constructor.prototype 4.如果给实例继承自原型的属性赋值 function Foo(){} Foo.prototype.name="test"; var o1=new.Foo(); var o2=new.Foo(); o1.name="张三";//不是修改原型中的name而是自己增加了一个name属性 console.log(ol.name+","+o2.name);

继承

1.最简单的继承就是将憋的对象的属性强加到我的身上,那么我就有这个成员了。 2.利用原型也可以实现继承,不需要在我身上添加任何成员,只要原型有了,我也有了。 结论:将属性,方法等成员利用混入的办法,加到构造函数的原型上,那么构造函数的实例就都具有该方法了。

混合式继承复杂描述

1.new DivTag()用来创建div对象 2.appenTo加到某元素上 3.扩展 img p span a 4.无论方法怎么写,方法是谁调用的,this就是谁 、、、

细节

使用点语法给原型添加成员与使用直接替换修改原型对象有什么区别? 1.原型指向发生了变化。 2.构造函数所创建的对象所继承的原型不同 3.新增的对象默认是没有constructor属性 注意:在使用替换的方式修改原型的时候,一般都会添加constructor属性 function Person(){} Person.prototype={ constructor:Person }; function Person(){} var o={} o.constructor=Person; Person.prototype=o; Person=123; 、、、

原型与继承

1.什么是原型? 神秘对象对于构造函数是原型属性,有构造函数就有一个原型属性, 2.如何使用原型? 利用点添加成员 直接替换添加成员 3.什么是原型继承? 实例对象是继承自原型对象的 一般的开发方式: 4.如何实现? 混合 function mix(o1,o2){ for(var key in o2){ o1[key]=02[key]; } } 直接替换原型对象 function ITcast(){}; ITcast.prototype=[]; *属性搜索原则 1.原型链 2.属性搜索原则 所谓的属性搜素原则,就是对象在访问属性或方法时,首先在当前对象当中查找; 如果当前对象中存储该属性或方法到,就停止查找,直接使用该属性或方法。 如果当前对象当中没有,就去当前原型中查找。 如果当前原型对象当中存储该属性或方法,就停止查找,直接使用该属性或方法。 如果原型中没有,就去原型的原型当中查找。 如此往复,直到object.prototype没有,就返回undefined. 如果是调用方法就报错。该对象不是一个函数。

DOM相关知识点以及原型的更多相关文章

  1. DOM相关知识点

    内容待补充... DOM相关注意题目: DOM的最小组成单位叫做 //节点 Node DOM 有自己的国际标准,目前的通用版本是 //DOM 3 DOM 树的根节点 //HTML 元素 Element ...

  2. http及浏览器相关知识点归纳

    http是应用层协议,采用请求/响应模型 1.浏览器地址栏输入URL地址后发生了什么? 浏览器判断地址是否是合理的URL地址,是否是http协议请求,如果是则进入下一步 浏览器对此URL进行缓存检查: ...

  3. React其它相关知识点

    React其它相关知识点 一,解释一下React Fiber? 简单来说,核心就是在虚拟dom和浏览器的调用栈之间多了一个虚拟调用栈,和虚拟dom一样,这个虚拟调用栈也是在内存中的,这个虚拟调用栈就类 ...

  4. UITableView相关知识点

    //*****UITableView相关知识点*****// 1 #import "ViewController.h" // step1 要实现UITableViewDataSou ...

  5. Android开发涉及有点概念&相关知识点(待写)

    前言,承接之前的 IOS开发涉及有点概念&相关知识点,这次归纳的是Android开发相关,好废话不说了.. 先声明下,Android开发涉及概念比IOS杂很多,可能有很多都题不到的.. 首先由 ...

  6. IOS开发涉及有点概念&相关知识点

    前言,IOS是基于UNIX的,用C/C+/OC直通系统底层,不想android有个jvm. 首先还是系统架构的分层架构 1.核心操作系统层 Core OS,就是内存管理.文件系统.电源管理等 2.核心 ...

  7. IOS之UI--小实例项目--添加商品和商品名(使用xib文件终结版) + xib相关知识点总结

    添加商品和商品名小项目(使用xib文件终结版) 小贴士:博文末尾有项目源码在百度云备份的下载链接. xib相关知识点总结 01-基本使用 一开始使用xib的时候,如果要使用自定义view的代码,就需要 ...

  8. 学习记录013-NFS相关知识点

    一.NFS相关知识点 1.NFS常用的路径/etc/exports NFS服务主配置文件,配置NFS具体共享服务的地点/usr/sbin/exportfs NFS服务的管理命令,exportfs -a ...

  9. TCP/IP 相关知识点与面试题集

    第一部分:TCP/IP相关知识点 对TCP/IP的整体认 链路层知识点 IP层知识点 运输层知识点 应用层知识点 (这些知识点都可以参考:http://www.cnblogs.com/newwy/p/ ...

随机推荐

  1. Git Sophisticated Commands

    Compare two branches: branch_1 and branch_2: git diff branch_1…branch_2 Merge specified files of one ...

  2. 不同场景下 MySQL 的迁移方案

    一 目录 一 目录 二 为什么要迁移 三 MySQL 迁移方案概览 四 MySQL 迁移实战 4.1 场景一 一主一从结构迁移从库 4.2 场景二 一主一从结构迁移指定库 4.3 场景三 一主一从结构 ...

  3. java基础复习 - 自动装箱

    Integer a = 127; // 将整形127装箱对象 Integer b = 127; // 同上 System.out.print( a==b ); // true System.out.p ...

  4. java中有关线程的题目

    1,看一下下面程序错误发生在哪一行! class Test implements Runnable{ public void run(Thread t){ } } 2,输出结果是什么? class T ...

  5. python类定义与c#的一些区别

    c#中可以定义一个空类,但是python中定义空类需要加pass class EmptyClass(object): pass python的lei是多继承   python子类继承了基类,如果子类也 ...

  6. linux分享六:字符串处理

    一:cut (1)其语法格式为:cut [-bn] [file] 或 cut [-c] [file] 或 cut [-df] [file] 使用说明cut 命令从文件的每一行剪切字节.字符和字段并将这 ...

  7. Spring学习总结(五)——Spring整合MyBatis(Maven+MySQL)二

    接着上一篇博客<Spring整合MyBatis(Maven+MySQL)一>继续. Spring的开放性和扩张性在J2EE应用领域得到了充分的证明,与其他优秀框架无缝的集成是Spring最 ...

  8. Javascript模块化开发,使用模块化脚本加载工具RequireJS,提高你代码的速度和质量。

    随着前端JavaScript代码越来越重,如何组织JavaScript代码变得非常重要,好的组织方式,可以让别人和自己很好的理解代码,也便于维护和测试.模块化是一种非常好的代码组织方式,本文试着对Ja ...

  9. Eclipse10个最有用的快捷键[From: Internet]

    1. ctrl+shift+r:打开资源这可能是所有快捷键组合中最省时间的了.这组快捷键可以让你打开你的工作区中任何一个文件,而你只需要按下文件名或mask名中的前几个字母,比如applic*.xml ...

  10. Windows Azure Service Bus (2) 队列(Queue)入门

    <Windows Azure Platform 系列文章目录> Service Bus 队列(Queue) Service Bus的Queue非常适合分布式应用.当使用Service Bu ...