JavaScript的BOM对象

BOM:浏览器对象模型

JavaScript和浏览器的关系:JavaScript的诞生就是为了能够让它再浏览器中运行。

1. 操作BOM对象

1.1 window

window代表浏览器窗口,也代表全局变量。

1、可以通过浏览器窗口(window)输出东西。

2、可以获取窗口长度和宽度。

完整代码如下:

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <title>JavaScript学习</title>
   <script>
      window.alert(1);
      console.log(window.innerHeight);
      console.log(window.innerWidth);
      console.log(window.outerHeight);
      console.log(window.outerWidth);
   </script>
</head>
<body>
</body>
</html>

1.2 location

location代表了当前页面的URL信息

以百度为例:输入location,如图所示:

其中,关键几项为:

host:"www.baidu.com"
href:"https://www.baidu.com/"
protocol:"https:"
reload:ƒ reload() //刷新网页

当输入:location.assign('https://www.cnblogs.com/WZ-BeiHang/')   //location.assign()用来设置新的地址

就会自动跳转到我的博客

1.3 document

document代表了当前页面,HTML DOM文档树

以百度为例:

还可以获取文档树节点:

完整代码如下:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>JavaScript学习</title>
<d1 id="app">
<dt> Java </dt>
<dd> JavaSE </dd>
<dd> JavaEE </dd>
</d1>

<script>
var dl = document.getElementById("app");
</script>
</head>
<body>
</body>
</html>

当能够动态获取文档树节点,就能实现删除和增加,就能动态控制网页。

1.4 获取网页的cookie

语法为:document.cookie

JavaScript的BOM对象的更多相关文章

  1. 第三章 JavaScript操作BOM对象

    第三章   JavaScript操作BOM对象 一.window对象 浏览器对象模型(BOM)是javascript的组成之一,它提供了独立与浏览器窗口进行交换的对象,使用浏览器对象模型可以实现与HT ...

  2. JavaScript之BOM对象

    JavaScript bom对象 BOM对象 window对象 所有浏览器都支持 window 对象.概念上讲.一个html文档对应一个window对象.功能上讲: 控制浏览器窗口的.使用上讲: wi ...

  3. JavaScript操作BOM对象

    1)windows对象 浏览器对象模型(BOM :Browser  Object  Model)是JavaScript的组成之一,它提供了独立于内容与浏览 器窗口进行交互的对象,使用浏览器对象模型可以 ...

  4. JQuery制作网页—— 第二章 JavaScript操作BOM对象

    1.window对象: 浏览器对象模型(BOM)是javascript的组成之一, 它提供了独立与浏览器窗口进行交换的对象,使用浏览器对象模型可以实现与HTML的交互. 它的作用是将相关的元素组织包装 ...

  5. JavaScript学习——BOM对象

    1.BOM 对象:浏览器对象模型(操作与浏览器相关的内容) 2.Window 对象 Window 对象表示浏览器中打开的窗口 setInterval():它有一个返回值,主要是提供给 clearInt ...

  6. javascript之BOM对象(一window对象)

    javascript包含三个部分,ECMAScript,BOM和DOM.ECMAScript是javascript的核心,包含javascript的基础语法.在Web中使用javascript,BOM ...

  7. 使用jQuery快速高效制作网页交互特效--JavaScript操作BOM对象

    JavaScript操作BOM 一.window对象: 二.window对象的属性和方法 1.windows对象的常用属性: 语法:window.属性名="属性值" 2.windo ...

  8. javascript之BOM对象总结

    BOM编程基础 全称 Browser Object Model,浏览器对象模型. JavaScript是由浏览器中内置的javascript脚本解释器程序来执行javascript脚本语言的. 为了便 ...

  9. javascript之BOM对象(三其他对象)

    一.navigator对象 navigator使用来识别浏览器的,是所有支持javascript的浏览器所共有的.与BOM的其他对象不同,每个浏览器的navigator对象都有一套自己的属性. 常见的 ...

随机推荐

  1. 面试想拿 10K,HR 说你只值 7K,该怎样回答或者反驳?

    当HR压你价,说你只值7K时,你可以流畅地回答,记住,是流畅,不能犹豫. 礼貌地说:"7K是吗?了解了.嗯~其实我对贵司的面试官印象很好.只不过,现在我的手头上已经有一份11K的offer. ...

  2. 一起学Vue之条件判断

    在Vue进行前端开发中,条件判断主要用于根据不同的条件来决定显示或隐藏,或者进行视图之间的切换,本文以一个简单的小例子简述v-if的常见用法,仅供学习分享使用,如有不足之处,还请指正. v-if 指令 ...

  3. 纪中17日T2 2322. capacitor

    2322. capacitor (File IO): input:capacitor.in output:capacitor.out 题目描述 输入 输出 样例输入 样例输出 数据范围限制 Solut ...

  4. AE神奇插件TypeMonkey—抖音点赞100W+的文字视频特效是如何做出来的?

    现在最火的东西,短视频必须要拥有姓名啦,抖音这些短视频平台风头正盛,我们也常常在上面看到一些文字动画Vlog,看着并不复杂,但是有些却有上百万的点击量,今天介绍的一款神奇插件——TypeMonkey, ...

  5. session 控制

    session 控制 beego 内置了 session 模块,目前 session 模块支持的后端引擎包括 memory.cookie.file.mysql.redis.couchbase.memc ...

  6. es6转码和package.json中的配置

    在线实时转换 需要babel-register .babelrc中: { "presets": [ "es2015" ] } 项目中main.js配置: 前提是 ...

  7. Vue开发环境跨域访问

    Vue开发环境跨域访问其他服务器或者本机其他端口,需要配置项目中config/index.js文件,修改如下 module.exports = { dev: { // Paths assetsSubD ...

  8. UVA12325-注意提高效率的思路

    题目大意:你有一个体积为N的箱子和两种数量无限的宝物.宝物1的体积为S1,价值为V1:宝物2的体积为S2,价值为V2.输入均为32位带符号的整数.你的任务是最多能装多少价值的宝物?   方法:其实也没 ...

  9. Luogu P1993 题解

    p1993 小康的农场 CSP_S 1=之后就没怎么写题解.. 推荐博客食用 预备知识 明显这是一道差分约束的题,以下简称差分 有些人可能不了解差分,请点 [传送门] 至于用差分做的题的特征,无一都是 ...

  10. PAT (Basic Level) Practice (中文)1031 查验身份证 (15 分)

    一个合法的身份证号码由17位地区.日期编号和顺序编号加1位校验码组成.校验码的计算规则如下: 首先对前17位数字加权求和,权重分配为:{7,9,10,5,8,4,2,1,6,3,7,9,10,5,8, ...