BOM DOM 简介
BOM和DOM简介
BOM,Browser Object Model ,浏览器对象模型。
BOM主要提供了访问和操作浏览器各组件的方式。
浏览器组件:
window(浏览器窗口)
location(地址栏)
history(浏览历史)
screen(显示器屏幕)
navigator(浏览器软件)
document(网页)
DOM,Document Object Model,文档对象模型。
DOM主要提供了访问和操作HTML标记的方式。
HTML标记:
图片标记
表格标记
表单标记
body、html标记
……
BOM和DOM不是JS的内容。它们是W3C制定的规范。但是,BOM和DOM在浏览器中以对象的形式得以实现。
换句话说:BOM和DOM都是由一组对象构成。
W3C是制作互联网标准的一个国际化的组织,如:XHTML、CSS、JavaScript、AJAX等。
BOM对象结构图
各对象之间是有层级关系的,那么各对象之间如何访问呢?
window.document.write(“OK”)
window.document.body.bgColor = “#FF0000”;
Window对象属性
window对象是所有其它对象的最顶层对象,因此,可以省略
document.write(“OK”);
document.body.bgColor = “#FF0000”;
window.alert(“OK”); ——> alert(“OK”);
window.prompt(“请输入一个分数”); ——> prompt(“请输入一个分数”);
属性:
name:指浏览器窗口的名字或框架的名字。这个名字是给<a>标记的target属性来用的。
设置窗口的名字:window.name = “newWin”
获取窗口的名字:document.write(name);
top:代表最顶层窗口。如:window.top
parent:代表父级窗口,主要用于框架。
self:代表当前窗口,主要用于框架中。
innerWidth:指浏览器窗口的内宽(不含菜单栏、工具栏、地址栏、状态栏),该属性Firefox支持。
在IE下,使用 document.documentElement.clientWidth 来代替 window.innerWidth
innerHeight:指浏览器窗品的内高(不含菜单栏、工具栏、地址栏、状态栏),该属性Firefox支持。
在IE下,使用 document.documentElement.clientHeight 来代替 window.innerHeight
document.documentElement 就是<html>标记对象
document.body 就是 <body>标记对象
BOM DOM 简介的更多相关文章
- HTML DOM简介
HTML DOM简介 1.当网页被加载时,浏览器会创建页面的文档对象模型(Document Object Model),HTML DOM模型被创建为对象的树.如下所示: 2.通过可编程的对象模型,Ja ...
- Dom 简介
HTML DOM 简介 DOM 教程 DOM 节点 HTML DOM 定义了访问和操作 HTML 文档的标准. 您应该具备的基础知识 在您继续学习之前,您需要对以下内容拥有基本的了解: HTML CS ...
- JavaScript:BOM&DOM
BOM(Browser Object Model): feature: 1.BOM has no relevant standards. 2.The fundamental object of BOM ...
- JavaScript BOM DOM 对象
title: JavaScript BOM DOM 对象 tags: JavaScript --- browser object model document onject model BOM对象 w ...
- 【转】了解nodejs、javascript间的关系!bom&dom&ecmascript
地址:https://www.cnblogs.com/JetpropelledSnake/p/9450810.html bom&dom:https://www.cnblogs.com/wang ...
- Javascript学习笔记2.1 Javascript与DOM简介
DOM(文档对象模型)简介 DOM(文档对象模型)针对HTML和XML文档的一个API. DOM可以将任何HTML或XML文档描绘成由多层节点构成的树形结构,它是中立于平台和语言的接口,允许程序和脚本 ...
- BOM DOM
http://www.cnblogs.com/yexiaochai/archive/2013/05/28/3102674.html DOM Document Object Model 文档对象模型 一 ...
- JS学习四(BOM DOM)
BOM Screen对象 console.log(window.width);//屏幕宽度 console.log(window.height);//屏幕高度 conso ...
- js BOM DOM
BOM对象 BOM(浏览器对象模型),可以对浏览器窗口进行访问和操作.使用 BOM,开发者可以移动窗口.改变状态栏中的文本以及执行其他与页面内容不直接相关的动作. 简而言之就是使 JavaScript ...
随机推荐
- Service4
DNS解析的作用• 为什么需要DNS系统– www.baidu.com 与 119.75.217.56,哪个更好记?– 互联网中的114查号台/导航员 • DNS服务器的功能– 正向解析:根据注册的域 ...
- CentOS7编译安装MPLAYER!!!
Linux装软件就是折磨人!! Mplayer官网下好release版本 然后./configure --[options] 注意:--prefix=/usr/local/mplayer 是安装路径- ...
- LightOJ 1203 Guarding Bananas (凸包最小顶角)
题目链接:LightOJ 1203 Problem Description Once there was a lazy monkey in a forest. But he loved banana ...
- 前端(十四)—— JavaScript常用类:Number、Date类、字符串、数组、Math类、正则
JS常用类:Number类.Date类.Math类.字符串.数组.正则 一.Number 1.常用数字 整数:10 小数:3.14 科学计数法:1e5 | 1e-5 正负无穷:Infinity | - ...
- 7年Java后端被淘汰,一路北漂辛酸史。。。
作者:春天花会开foryou oschina.net/question/3465562_2281392 今天分享一位同行的经历: 本人Java开发6年半不到7年的样子. 英语专业,临毕业跟着隔壁专业去 ...
- CF#537 C. Creative Snap /// DFS
题目大意: 给定n k A B为位置长度 复仇者个数 两种花费 在一段为1~2^n的位置中 某些位置存在一些复仇者 求消灭所有复仇者的最小花费 对一段位置可以有两种处理方式 1.若该段长度至少为2 可 ...
- keepAlived主备及双主
nginx用默认配置即可 1.主备配置 1.主keepAlived配置 vrrp_instance VI_1 { state MASTER #主备区分 interface eth0 virtual_r ...
- JS window对象 计时器setTimeout() setTimeout()计时器,在载入后延迟指定时间后,去执行一次表达式,仅执行一次。 语法: setTimeout(代码,延迟时间);
计时器setTimeout() setTimeout()计时器,在载入后延迟指定时间后,去执行一次表达式,仅执行一次. 语法: setTimeout(代码,延迟时间); 参数说明: 1. 要调用的函数 ...
- Python Faker的使用 及 常用函数的查询
安装faker pip install faker faker的使用 引用:from faker import Faker 初始化:f=Faker(locale='zh_CN') # 默认是en_U ...
- Atcoder arc092
E-Both Sides Merger 给你一个序列,支持两种操作,直到序列中只有一个数时停下来,使得剩下数最大,并输出选数方案. 操作1:扔掉一个最前端或最后端的元素.操作2:选取一个不在边界上的元 ...