DOM简介

1、html DOM：当网页被加载时，浏览器会创建页面的文档对象模型（Document Object Model）

2、DOM操作html

JS能改变页面中的所有html元素

JS能改变页面中的所有html属性

JS能改变页面中的所有css样式

JS能对页面中所有事件做出反应

DOM操作HTML

1、改变HTML输出流：注意绝对不要在文档加载完成之后使用document.write().这会覆盖文档

2、寻找元素：通过ID寻找到html元素

通过标签名寻找到html元素

document.getElementsByTagName("p");//相同元素的第一个

3、改变html内容：使用属性：innerHTML

4、改变html属性：使用属性：attribute

DOM操作css

1、通过DOM对象改变CSS

语法：document.getElementById(id).style.property=new style

DOM EventListener

1、DOM EventListener

方法：addEventListener();  方法用于向指定元素添加时间句柄   (比较方便)

removeEventListenner(); 移除方法添加的事件句柄

javascript DOM对象的更多相关文章

  1. JavaScript DOM对象和JQuery对象相互转换

    1.分析源代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www ...

  2. javascript DOM对象转jquery对象

    首先,假设一种情形:要在HTML文件中为一个select对象添加一个函数,这个函数的名字叫dynamic_change(this),当select的option被改变的时候调用onchange事件来处 ...

  3. JavaScript DOM 对象

    JavaScript DOM 对象   什么叫DOM,DOM是文档对象模型(Document Object Model,是基于浏览器编程(在本教程中,可以说就是DHTML编程)的一套API接口,W3C ...

  4. 前端基础：JavaScript DOM对象

    JavaScript DOM对象 通过HTML DOM,可以访问JavaScript HTML文档的所有元素. 一.HTML DOM(文档对象模型) 当网页被加载时,浏览器会创建页面的文档对象模型(D ...

  5. 浏览器环境下的javascript DOM对象继承模型

    这张图是我直接在现代浏览器中通过prototype原型溯源绘制的一张浏览器宿主环境下的javascript DOM对象模型,对于有效学习和使用javascript DOM编程起到高屋建瓴的指导作用, ...

  6. javascript DOM对象（2）

    访问兄弟节点 1. nextSibling 属性可返回某个节点之后紧跟的节点(处于同一树层级中). 语法: nodeObject.nextSibling 说明:如果无此节点,则该属性返回 null. ...

  7. javascript DOM对象（1）

    0.文档对象模型DOM(Document Object Model)定义访问和处理HTML文档的标准方法. DOM 将HTML文档呈现为带有元素.属性和文本的树结构(节点树). 将HTML代码分解为D ...

  8. javascript - DOM对象控制HTML元素详解

    1.方法   getElementsByName() -- 获取name getElementByTagName() -- 获取  getAttribute()         --获取元素属性 se ...

  9. web前端学习（四）JavaScript学习笔记部分（7）-- JavaScript DOM对象控制HTML元素详解

    1.方法 getElementsByName() 获取name 可以获取一个数组类型数据(参数加引号) getElementsByTagName() 获取元素   getAttribute() 获取元 ...

随机推荐

  1. 【No.1】监控Linux性能25个命令行工具

    如果你的Linux服务器突然负载暴增,告警短信快发爆你的手机,如何在最短时间内找出Linux性能问题所在?通过以下命令或者工具可以快速定位 top vmstat lsof tcpdump netsta ...

  2. 【Android测试】【第十一节】Uiautomator——简介

    ◆版权声明:本文出自胖喵~的博客,转载必须注明出处. 转载请注明出处:http://www.cnblogs.com/by-dream/p/4872244.html 前言 在App的测试中,除了单元测试 ...

  3. SAX解析XML

    package ls.xml; import java.io.StreamCorruptedException; import javax.xml.stream.events.EndElement; ...

  4. C++ 类成员函数作为参数

    #include <iostream> using namespace std; typedef int int32_t; struct IMsgBody{ int body; }; st ...

  5. zepto源码--width,height--学习笔记

    width和height函数,实际上通过css方法也完全可以取到这两个函数的结果.获取width,$elem.css('width');设置width的话,$elem.css('width', 100 ...

  6. [LeetCode]题解（python）：094 Binary Tree Inorder Traversal

    题目来源 https://leetcode.com/problems/binary-tree-inorder-traversal/ iven a binary tree, return the ino ...

  7. Xcode --自动注释插件VVDocumenter-Xcode（配置须知）

    VVDocumenter-Xcode 是由 @onevcat 喵神开发的一个Xcode插件,其作用是在Xcode中输入"///"后自动生成规范的文档注释,的确非常好用而且实用. 百 ...

  8. Java学习-005-初学常用的几个经典循环控制源代码

    最近一段时间公司 App 改版,一直处在需求评审.代码评审.测试计划.测试用例.用例评审.用例执行.缺陷管理.测试总结的循环中,因而博客也好久没有更新了.虽然工作确实忙了点,但是也是自己懒惰了,从今天 ...

  9. asp.net中iframe页面用jQuery向父页面传值

    在asp.net页面有时一个页面会通过iframe嵌套另一个页面,下面的例子讲述的是被嵌套的iframe页面向父页传值的一种方式,用jQuery即可. iframe页面代码: <!DOCTYPE ...

  10. Asp.net MVC 中超链接的三个方法及比较

    在Asp.net WebForm开发中,我们通过a标签进行跳转时,通常的写法是:<a href="index.aspx">首页</a>, 在Asp.net ...