DOMBOM(source、methods、contents、Application)

何为DOM?

Document Object Model Dom,是W3C组织推荐的处理可扩展标志语言的标准编程接口。在网页上,组织页面的对象被组织在一个树形结构中,用来表示文档中对象的标准模型就称为DOM。

可以认为DOM是页面上数据和结构的一个树形表示。

Source:

DOM的历史可以追溯至1990年代后期微软与Netscape的“浏览器大战”,双方为了在JavaScript与JScript一决生死,于是大规模的赋予浏览器强大的功能。微软在网页技术上加入了不少专属事物,既有VBScript、ActiveX、以及微软自家的DHTML格式等,使不少网页使用非微软平台及浏览器无法正常显示。DOM即是当时蕴酿出来的杰作。

Methods:

HTML DOM是关于如何获取、修改、添加或删除HTML元素的标准。

HTML文档中的所有节点组成了一个文档树。

访问HTML元素等同于访问节点,主要有以下三种方式:

1)通过使用getElementById()方法

2)通过使用getElementByTagName()方法

3)通过使用getElementByClassName()方法

获取到DOM对象后,可以做很多事情,如获取该节点的各种信息,进一步获取其子节点、父节点的信息,还可以层层推进直到根或叶子。

Contents:

 

 

DOM= Document Object Model,文档对象模型,DOM可以以一种独立于平台和语言的方式访问和修改一个文档的内容和结构。换句话说,这是表示和处理一个HTML或XML文档的常用方法。

换句话说,这是表示和处理一个HTML或XML文档的常用方法。有一点很重要,DOM的设计是以对象管理组织(OMG)的规约为基础的,因此可以用于任何编程语言。最初人们把它认为是一种让JavaScript在浏览器间可移植的方法,不过DOM的应用已经远远超出这个范围。Dom技术使得用户页面可以动态地变化,如可以动态地显示或隐藏一个元素,改变它们的属性,增加一个元素等,Dom技术使得页面的交互性大大地增强。

Application:

通过 JavaScript,您可以重构整个 HTML 文档。您可以添加、移除、改变或重排页面上的项目。

DOM的修改

1)改变HTML内容;

2)改变CSS样式;

3)改变HTML属性;

4)创建新的HTML元素;

5)删除已有的HTML元素;

6)改变时间(处理程序)。

也就是说,从dom操作开始,真正能够通过编程对文档进行控制。

何为BOM?

 

Source:

BOM:Browser Objec Model,是指浏览器对象模型,是用于描述这种对象和对象之间层次关系的模型。BOM提供了独立于内容的、可以与浏览器窗口进行互动的对象结构。

Methods:

对BOM的子对象包括document、history、location、screen、navigator和frame对象,每个对象都有许多的操作方法。

DOM对象的方法前面也说了,就如window,有window.open(),打开窗口,或window.close,关闭窗口,再如系统对话框,消息框alert,对话框confirm等等。

Contents:

BOM由多个对象组成,其中代表浏览器窗口的window对象是BOM的顶层对象,其他对象是该对象的子对象,包含了document、history、location、screen、navigator和frame对象。

 

Application:
1. 弹出新浏览器窗口的能力;
2. 移动、关闭和更改浏览器窗口大小的能力;
3. 可提供WEB浏览器详细信息的导航对象;
4.可提供浏览器载入页面详细信息的本地对象;
5 .可提供用户屏幕分辨率详细信息的屏幕对象;
6. 支持Cookies;
7. Internet Explorer对BOM进行扩展以包括ActiveX对象类,可以通过JavaScript来实现ActiveX对象。

 

转载于:https://www.cnblogs.com/ceneasy/p/9853611.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/249139.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

spring-注解---IOC(3)

spring--注解---IOC(3) package com.zwj.bean;public class Blue {public Blue(){System.out.println("blue...constructor");}public void init(){System.out.println("blue...init...");}public void detory(){System.out.println("blue...detory..…

在div中设置文字与内部div垂直居中

要实现如图一所示的结果&#xff1a; html代码如下&#xff1a; <!DOCTYPE html> <html><head lang"zh"><meta http-equiv"X-UA-Compatible" content"IEedge"><meta charset"utf-8" /><title>商…

王之泰201771010131《面向对象程序设计(java)》第九周学习总结

第一部分&#xff1a;理论知识学习部分 第7章异常、日志、断言和调试 概念&#xff1a;异常、异常类型、异常声明、异常抛出、 异常捕获1.异常处理技术2.断言的概念及使用3.基本的调试技巧 1&#xff09;异常的概念 a.Java的异常处理机制可以控制程序从错误产生的 位置转移到能…

Java学习——使用Static修饰符

程序功能&#xff1a;通过两个类 StaticDemo、LX4_1 说明静态变量/方法与实例变量/方法的区别。 package Pack1;public class Try {public static void main(String[] args) {// TODO Auto-generated method stubSystem.out.println("静态变量x"StaticDemo.getX());非…

JavaScript从入门到精通之入门篇(一)概念与语法

入门篇大纲 第一部分 概念与语法 1.JavaScript的历史 2.基本概念 3.JavaScript的使用、调试和异常处理 4.基本词法和变量 5.数据类型和类型转换 6.运算符 算数运算符 赋值运算符 一元运算符 使用一元运算符&#xff0c;将会把所有的内容转换为数值运算&#xff0c;不…

【小记】-005--纯CSS实现的小玩意儿

效果图奉上 代码奉上 <!DOCTYPE html> <html lang"zh"><head><meta charset"UTF-8"><meta name"viewport" content"widthdevice-width, initial-scale1.0"><meta http-equiv"X-UA-Compatible&q…

JavaScript从入门到精通之入门篇(二)函数和数组

入门篇大纲 第二部分 函数与数组 1.函数 函数的定义 普通函数 function 函数名 &#xff08;表达式1…&#xff09; { 代码块 }js是解释性语言&#xff0c;在当前script标签代码执行的开始阶段&#xff0c;就会将普通函数放入堆中&#xff0c;也只是将引用放入堆中&#xf…

一道Python面试题

无意间&#xff0c;看到这么一道Python面试题&#xff1a;以下代码将输出什么&#xff1f; def testFun(): temp [lambda x : i*x for i in range(4)] return temp for everyLambda in testFun(): print (everyLambda(2))脑中默默一想&#xff0c;这还用说么&#xff0c;肯定是…

Windows下的ssh姐妹花 Xshell 和 Xftp

Windows下的ssh姐妹花 Xshell 和 Xftp 今天是3月8号&#xff0c;中国传统的三八妇女节&#xff0c;是距离中国新兴节日三七女生&#xff08;神&#xff09;节最近的一个全国性节日&#xff0c;今天我也是宅在家&#xff0c;研究了一下近日工作上遇到的一个纯软件技术问题。废话…

关于数字证书理解的简单整理以及12306站点证书简单分析

版权声明&#xff1a;本文为博主原创文章&#xff0c;未经博主允许不得转载。 https://blog.csdn.net/sundacheng1989/article/details/25540601 首先简单理解一下什么是数字证书。这里是一篇英文文档&#xff0c;描写叙述的非常形象。形象的描写叙述了什么是公钥。什么是私钥。…

Mac中安装Node和版本控制工具nvm遇到的坑

首先说说常规的安装 1. 下载nvm,使用nvm来管理Node版本 官方文档 windows 版本  https://github.com/coreybutler/nvm-windows mac 版本    https://github.com/creationix/nvm#install-script 命令行 尽量不要用brew&#xff0c;免得掉坑 curl -o- https://raw.githubu…

wepy - 与原生有什么不同(x.wpy)使用实例

源码 1 <template>2 <view classmark wx:if"{{showMark}}">3 <view animation"{{animationData}}" class"animCat">4 <image src"http://osk1hpe2y.bkt.clouddn.com/18-5-30/34559443.jpg"></…

CSS实现div梯形分割

原理 使用的border边框属性结合svg 转换 详见代码 <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><title>css实现div边框斜角</title><style type"text/css"> .labels {display: i…

算法学习——决策单调性优化DP

update in 2019.1.21 优化了一下文中年代久远的代码 的格式…… 什么是决策单调性&#xff1f; 在满足决策单调性的情况下&#xff0c;通常决策点会形如1111112222224444445555588888..... 即不可能会出现后面点的决策点小于前面点的决策点这种情况。 那么这个性质应该如何使用…

SVG画一个箭头

参考菜鸟手册&#xff1a; https://www.runoob.com/svg/svg-tutorial.html 打开菜鸟中的在线工具 在可视化截图拖拉元素绘制箭头 点击command U 查看源码 将源码拷入html代码中&#xff0c;查看效果 最后&#xff0c;贴出源码供大家参考 <!DOCTYPE html> <…

数字签名与HTTPS详解

因为HTTP协议本身存在着明文传输、不能很好的验证通信方的身份和无法验证报文的完整性等一些安全方面的确点&#xff0c;所以才有了HTTPS的缺陷。HTTPS确切的的说不是一种协议&#xff0c;而是HTTP SSL (TSL)的结合体。HTTP报文经过SSL层加密后交付给TCP层进行传输。SSL(安全套…

WPF效果(GIS三维续篇)

去年这个时候简单的摸索了一下三维的GIS相关的东西,也就是仅仅玩耍了一把,这次来点真正用的上的干货效果效果&#xff1a; 1、加载自定义百度样式的瓦片效果 2、加载自定义百度样式的缩放效果 3、快速手动进去咱的大帝都 4、加载海量Mark效果 5、加载海量Mark和简单模型效果 6、…

[19/04/23-星期二] GOF23_创建型模式(工厂模式、抽象工厂模式)

一、工厂模式(分为&#xff1a;简单工厂模式、工厂方法模式、抽象工厂模式) 实现了创建者和调用者的分离 核心本质&#xff1a;1、实例化对象&#xff0c;用工厂方法代替new操作&#xff1b;2、将选择实现类、创建对象统一管理和控制&#xff0c;从而将调用者跟实现类解耦。 简…

Chrome浏览器12px问题-webkit-text-size-adjust: none 已失效的解决方案

对于早期的chrome, 如果要想显示12px以下的字体&#xff0c;一般通用的方案都是在对应的元素中添加 div {-webkit-text-size-adjust: none; }但是我今天遇到的需求&#xff0c;添加了之后没有反应&#xff0c;而且浏览就根本不支持这种写法。 在网上看到了博客《Chrome浏览器…

深入理解vue中的slot与slot-scope

写在前面 vue中关于插槽的文档说明很短&#xff0c;语言又写的很凝练&#xff0c;再加上其和methods&#xff0c;data&#xff0c;computed等常用选项在使用频率、使用先后上的差别&#xff0c;这就有可能造成初次接触插槽的开发者容易产生“算了吧&#xff0c;回头再学&#…