学习前端的都会了解到一些Dom操作,让我们来看看Dom操作有哪些吧!

    

  DOM(即 Document Object Mode) 是 W3C(万维网联盟)的标准。

  DOM 定义了访问 HTML 和 XML 文档的标准:“W3C 文档对象模型 (DOM) 是中立于平台和语言的接口,它允许程序和脚本动态地访问和更新文档的内容、结构和样式。”

  W3C DOM 标准被分为 3 个不同的部分:

        •  核心 DOM - 针对任何结构化文档的标准模型

        •  XML DOM - 针对 XML 文档的标准模型

        •  HTML DOM - 针对 HTML 文档的标准模型

    其中,在 HTML DOM 中,所有事物都是节点。DOM 是被视为节点树的 HTML。

  根据 W3C 的 HTML DOM 标准,HTML 文档中的所有内容都是节点:

        •  整个文档是一个文档节点

        •  每个 HTML 元素是元素节点

        •  HTML 元素内的文本是文本节点

        •  每个 HTML 属性是属性节点

        •  注释是注释节点

      HTML DOM 将 HTML 文档视作树结构。这种结构被称为节点树。通过 HTML DOM,树中的所有节点均可通过 JavaScript 进行访问。所有 HTML 元素(节点)均可被修改,也可以创建或删除节点。

   怎样添加、移除、移动、复制、创建和查找节点。 

      创建新节点:

             createDocumentFragment() //创建一个DOM片段

          createElement() //创建一个具体的元素

          createTextNode() //创建一个文本

     添加、移除、替换、插入:

          appendChild()

          removeChild()

          replaceChild()

          insertBefore()

       查找:

          getElementsByTagName() //通过标签名称

          getElementsByName() //通过元素的Name属性的值

          getElementById() //通过元素Id,唯一性

          getElementsByClassName()//通过class找

          getElementsByClassName()//通过class找

       事件

      (1)冒泡型事件:事件按照从最特定的事件目标到最不特定的事件目标(document对象)的顺序触发。

      (2)捕获型事件(event capturing):事件从最不精确的对象(document 对象)开始触发,然后到最精确(也可以在窗口级别捕获事件,不过必须由开发人员特别指定)。

      (3)DOM事件流:同时支持两种事件模型:捕获型事件和冒泡型事件,但是,捕获型事件先发生。两种事件流会触及DOM中的所有对象,从document对象开始,也在document对象结束。

      常用事件:

           Onclick:点击事件

         Ondbclick:双击事件

         Onmousedown:鼠标点击

         Onmouseup;当鼠标按下时抬起;

         Onmousmove;鼠标移动;

         Onmousover;鼠标移过;

         Onmousout;鼠标离开

         Onload:文档加载完毕

         Windon.onload=function(){}



有关Dom的一些操作的更多相关文章

  1. dom节点的操作

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

  2. 基础DOM和CSS操作(三)

    CSS方法 jQuery不但提供了CSS的核心操作方法,比如.css()..addClass()等.还封装了一些特殊功能的CSS操作方法,我们分别来了解一下. width()方法 方法名 描述 wid ...

  3. 基础DOM和CSS操作(二)

    元素样式操作 元素样式操作包括了直接设置CSS样式.增加CSS类别.类别切换.删除类别这几种操作方法.而在整个jQuery使用频率上来看,CSS样式的操作也是极高的,所以需要重点掌握. CSS操作方法 ...

  4. 基础DOM和CSS操作(一)

    DOM简介 DOM是一种文档对象模型,方便开发者对HTML结构元素内容进行展示和修改.在JavaScript中,DOM不但内容庞大繁杂,而且我们开发的过程中需要考虑更多的兼容性.扩展性.在jQuery ...

  5. JQuery处理DOM元素-属性操作

    JQuery处理DOM元素-属性操作 //操作元素的属性: $('*').each(function(n){ this.id = this.tagName + n; }) //获取属性值: $('') ...

  6. 10-JavaScript之DOM的事件操作

    JavaScript之DOM的事件操作 1.介绍 JavaScript基础分为三个部分: ECMAScript:JavaScript的语法标准.包括变量.表达式.运算符.函数.if语句.for语句等 ...

  7. 前端 ----关于DOM的事件操作

    关于DOM的事件操作   一.JavaScript的组成 JavaScript基础分为三个部分: ECMAScript:JavaScript的语法标准.包括变量.表达式.运算符.函数.if语句.for ...

  8. python 全栈开发,Day51(常用内置对象,函数,伪数组 arguments,关于DOM的事件操作,DOM介绍)

    昨日内容回顾 1.三种引入方式 1.行内js <div onclick = 'add(3,4)'></div> //声明一个函数 function add(a,b){ } 2. ...

  9. jQuery对标签、类样式、值、文档、DOM对象的操作

    jquery的标签属性操作 使用attr()方法对html标签属性进行操作,attr如果参数是一个参数,表示获取html标签的属性值,如果是两个参数则是设置标签属性名以及对象的属性值 .prop()适 ...

  10. Dom的样式操作和属性操作

    如果说web的研究对象是html和css,那么整个dom结构,包含html树和dom树的dom结构才是研究对象,而在整个页面呈现上面,js起到的作用则是异步的用户行为. 按照上面整个思路,获取dom元 ...

随机推荐

  1. ssh公钥认证原理及设置root外的其他用户登录ssh

    1)创建其他用户 useradd [-d 登录目录] [-G ssh][用户名]  一定要将用户添加到ssh组不然无法没有权限登录ssh 2)设置ssh不允许root登录 vi /etc/ssh/ss ...

  2. python音频处理用到的操作

    作者:桂. 时间:2017-05-03  12:18:46 链接:http://www.cnblogs.com/xingshansi/p/6799994.html 前言 本文主要记录python下音频 ...

  3. Volley使用指南

    1.什么是Volley 在这之前,我们在程序中需要和网络通信的时候,大体使用的东西莫过于AsyncTaskLoader,HttpURLConnection,AsyncTask,HTTPClient(A ...

  4. coding.net及git的使用方式

    一般部分测试的公司里可能会用到代码管理工具,这里可能不得不推荐coding.net和git这个工具,类似于svn,不过用命令行的情况多点 这里简单介绍下 1.建立coding.net 首先新建一个co ...

  5. ③jQuery生成html元素

    动态生成HTML元素 绑定事件

  6. ASP.Net WebAPI与Ajax进行跨域数据交互时Cookies数据的传递

    前言 最近公司项目进行架构调整,由原来的三层架构改进升级到微服务架构(准确的说是服务化,还没完全做到微的程度,颗粒度没那么细),遵循RESTFull规范,使前后端完全分离,实现大前端思想.由于是初次尝 ...

  7. 《Android进阶》之第三篇 深入理解android的消息处理机制

    Android 异步消息处理机制 让你深入理解 Looper.Handler.Message三者关系 android的消息处理机制(图+源码分析)——Looper,Handler,Message an ...

  8. AFNetworking 动态修改acceptableContentTypes 设置ContentType

    AFJSONResponseSerializer+Serializer.h #import <AFNetworking/AFNetworking.h> @interface AFJSONR ...

  9. SVN分支/合并原理及最佳实践

    转自:http://blog.csdn.net/e3002/article/details/21469437 使用svn几年了,一直对分支和合并敬而远之,一来是因为分支的管理不该我操心,二来即使涉及到 ...

  10. SVN如何迁移到Git?

    最近在使用华为软件开发云进行开发项目管理,目前华为软件开发云支持500M的免费项目空间,而且还可以在线编译和构建,不用担心开发环境和生产环境的不同,很好的体现了DevOps的开发理念. 之前一直是用s ...