Javascript和HTML dom

今天在看DOM那一章的时候突然想到一个问题,众所周知的js的数据类型有两种:原始类型和对象类型。其中原始类型又包括以下几种类型:数字型、字符串型、布尔值、null和undefined。其中对象类型包括用户通过各种方法自己创建的对象和一些函数数组啊之类的特殊对象。

然后,我就在思考那么DOM对象属于这里面的哪一类呢(望哥哥姐姐不要嘲笑),然后我就在找各种资料,然后却并没有发现他到底属于其中哪一部分,然后,乱翻的时候,突然发现了这张图

然后,才有了恍然大悟的感觉:

js 即 JavaScript ,是一种网页脚本语言,可以在网页上实现一些动态效果。
DOM 是HTML文档结构,其实就是为了能让js操作html元素而制定的一个规范,dom 的根本就是 document 对象,改对象有很多属性和方法,例如创建节点、复制节点、移除节点、修改属性等。

时间: 2025-01-14 08:42:35

Javascript和HTML dom的相关文章

javascript系列之DOM(二)

原生DOM扩展 我们接着第一部分来说,上文提到了两种常规的DOM操作:创建文档片段和遍历元素节点.我们知道那些雨后春笋般的库,有很大一部分工作就是提供了一些优秀 的DOM操作API.可见原生的一些方法和属性,还不能很灵活快捷的来完成我们所希望的操作.下面将总结出总结出几种很实用的扩展方法.包括 after()和before(), A:after()和before() 1 function after(elem){ 2 if(this.parentNode){ 3 this.parentNode.

2014年辛星解读Javascript之用DOM动态操纵HTML元素

关于DOM,我们了解了可以用DOM操纵HTML的一些属性和样式,还可以为HTML元素绑定事件等等,那么接下来,我们将涉及到用DOM来动态的创建.删除HTML等一些操作,我的核心思路还是重实战,因此,代码示例是肯定少不了的. 不过在使用DOM动态操纵HTML元素之前,我们还是先了解一下DOM树,下面是我从网上找的一个DOM树的图片,它的截图如下: 如果大家学习过"树"这种数据结构,就会很好理解,一个父节点可以包含N个子节点,这些子节点可能是div.p等标签,也可以是属性,还可以是中间的文

【JQuery】jquery对象和javascript对象即DOM对象相互转换

jQuery 对象是通过 jQuery 包装DOM 对象后产生的对象.jQuery 对象是 jQuery 独有的,其可以使用 jQuery 里的方法,但是不能使用 DOM 的方法:例如: $("#img").attr("src","test.jpg"); 这里的 $("#img")就是 jQuery 对象. DOM对象就是Javascript 固有的一些对象操作.DOM 对象能使用Javascript 固有的方法,但是不能使用

JavaScript和HTML DOM的区别与联系

JavaScript和HTML DOM的区别与联系 区别: javascript JavaScript 是因特网上最流行的浏览器脚本语言.很容易使用!你一定会喜欢它的! JavaScript 被数百万计的网页用来改进设计.验证表单.检测浏览器.创建cookies,以及更多的应用. HTML DOM HTML DOM 是 W3C 标准(是 HTML 文档对象模型的英文缩写,Document Object Model for HTML). HTML DOM 定义了用于 HTML 的一系列标准的对象,

javascript JavaScript强化教程——DOM编程性能优化

本文为 H5EDU 机构官方 HTML5培训 教程,主要介绍:JavaScript强化教程 ——DOM编程性能优化 DOM的访问与修改访问DOM元素是有代价的——修改元素侧更为昂贵,因为他会导致浏览器重新计算页面的几何变化.当然,最坏的情况是在循环中访问或修改元素,尤其是对HTML元素几何循环操作.为了让你对DOM编程带来的性能问题有个量化的了解,请看下面的简单实例: function innerHTMLLoop(){ for(var count = 0;count<15000;count++)

【转】console.time 简单分析javascript动态添加Dom节点的性能

本文代码约定 1 el: 指的是增加直接点的DOM节点 2 totalNum: 为100000(值越大越能体现差距)指的是循环创建的DOM节点 3 for(var i=0;i<totalNum;i++){}: 我们用for来表示就好了,简写代码 如果叫你用javascript动态增加DOM节点,你有哪几种思路呢? 1 .使用innerHTML和字符串拼接 console.time("time1"); var str = ""; for{ str += &quo

console.time 简单分析javascript动态添加Dom节点的性能

Bullshit 本来想每天都更新下博客的,但是最近要考试,还有就是自己还是停留在暗自窃喜中吧(这种想法要改变).其实最近总在想,自己要怎么去管理自己的数据,每天的生活都是对自己的数据的增删查改.昨天把自己的电脑重装了,确实很多软件的存放要改地方了,之前不知道怎么去管理软件安装,所以放得乱七八糟的.说好一大堆废话之后,我最后再说一遍,管好自己的时间.数据真的比你学习东西重要. Method 本文代码约定 1 el: 指的是增加直接点的DOM节点 2 totalNum: 为100000(值越大越能

javascript系列之DOM(一)

原文:javascript系列之DOM(一) DOM(document object moudle),文档对象模型.它是一个中立于语言的应用程序接口(API),允许程序访问并修改文档的结构,内容和样式.也就是一切语言(js,php 等)对web的操作是建立在DOM的基础之上的.行为的发生,首先必须获取文档中的一个对象作为其载体. DOM发展史 在漫长的互联网发展史上DOM一共经历了四个阶段.当前,我们正处在DOM 3阶段. DOM 0 :不是W3C规范,只是Netscape Navigator

JavaScript强化教程——DOM编程(两种控制div移动的方法)

本文为H5EDU机构官方HTML5培训教程,主要介绍:JavaScript强化教程--DOM编程(两种控制div移动的方法) 第一种 按钮控制首先 创建两个html按钮和一个div并给div一个样式 input type="button" value="左" id="1"> <input type="button" value="右" id="2"> <div i

一些JavaScript中的DOM的优化小技巧

在进行DOM优化时需要关注的问题有:修改DOM的时候,会引起页面的重排,重绘.因为JS是单线程执行的,那么在重排重绘的过程中可能会阻塞用户的操作.为了更好的用户体验,必须要严格控制这些操作. 一.对象集合 NodeList 当我们调用:getElementsByTagName,getElementsByName,getElementsByClassName的时候,返回的结果是一个NodeList,这个NodeList是实时的.如果你修改对应的html,那么NodeList中也会得到修改. 而且,