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. NPM 包管理工具详解,使用教程

    NPM 包管理工具 1.1 定义:什么是 NPM NPM 全称 Node Package Manager,它是 JavaScript 的包管理工具, 并且是 Node.js 平台的默认包管理工具.通过 ...

  2. BloodHound可视化之域分析

    一.简介 BloodHound是一款将域内信息可视化的单页的web应用程序,是一款在域内进行信息收集的免费工具: bloodhound通过图与线的形式,将域内用户.计算机.组.会话.ACL以及域内所有 ...

  3. 使用Sqlserver 2012 导出表数据为SQL脚本

    目录 前言 具体步骤 前言 很多时候,我们需要把数控库中的表的数据导出成SQL脚本的情形.然后,在别的库执行的情况. 以下,总结使用Sqlserver 2012数据库中表数据导出成SQL脚本的步骤. ...

  4. 诱人的 react 视频教程-基础篇(14 个视频)

    诱人的 react 视频教程-基础篇(14 个视频) 诱人的 react 视频教程 - 基础篇 #1 介绍「07:25」 诱人的 react 视频教程 - 基础篇 #2 create-react-ap ...

  5. CSS 如何实现当鼠标放在上面时整行变色呢?

    摘要:下文讲述css中实现鼠标放在指定行上面时,整行变色的方法分享,如下所示: 实现思路:使用:hover伪类,实现当鼠标指向时,其背景色发生相应的变化,如下例所示: 例: 下文中的div,当鼠标放上 ...

  6. VISIO 的一些技巧

    1.复制绘图 如果格式改变,在“设计”选项卡里将“将主题运用于新建的形状”前面的√去掉

  7. 【终端使用】"scp"命令,远程拷贝文件

    一."scp"命令的使用 "scp"命令,是"secure copy (remote file copy program)"英文单词的缩写, ...

  8. day5 字典 dict

    数据类型划分:可变数据类型,不可变数据类型不可变数据类型:元组,数字,布尔,str, == 可哈希可变数据类型:list , dict, set == 不可哈希dict的 key 必须是不可变数据类型 ...

  9. idea插件不兼容问题

    https://plugins.jetbrains.com/ 找对应版本的插件

  10. gulp常用插件之autoprefixer使用

    更多gulp常用插件使用请访问:gulp常用插件汇总 autoprefixer这是一款自动管理浏览器前缀的插件,它可以解析CSS文件并且添加浏览器前缀到CSS内容里. 更多使用文档请点击访问autop ...