BOM部分整理 (章节 8、9)

概览:

一、介绍BOM

在web中,JS的核心对象就是BOM。

1.1 在浏览器中,window对象 == global

所以,你在全局环境下定义的变量,函数都会自动成为window的属性和方法。

var a = 1;
console.log(window.a); //
function fn(){
console.log("window");
}
console.log(window.fn()); //window

tips:通过var声明的变量,无法被delete操作符删除。因为它默认了configurable =false。

直接写且不声明的变量,以及通过window.xx定义的变量都可以通过delete删除。

var a = 1;
console.log(delete a);//false
window.b = 2;
console.log(delete b);//true
c = 3;
console.log(delete c);//true

二、frame和window的关系

每一个frame窗口都有一个window对象,并且他们保存在JS定制的frames数组里,可以通过frames[0]来获取。

每个window对象都有自己的名称,属性为name。

这部分的内容了解就好,只是定义了一些iframe和window之间互相访问的关系。

因为现在开发很少使用iframe了,就是说不时髦了。

三、窗口相关的方法

整理如上,值得注意的几点:

1. 浏览器和屏幕是两个概念,很多同学调用screen方法发现一直都是0,因为你们全屏了!

2.innerWidth/Height同类的方法还有outerWidth/Height,因为实现的效果基本相同,所以用的基本都是inner系列。

3. 本节的重点是定时器部分的内容,建议多加练习。

4. alert这类方法,基本只是在测试时候用了,正常页面谁会搞这个东西给用户看。

三、location对象

对于搜索框的对象操作,是BOM部分非常重要的内容,概览如下:

它既是window的属性,又是document对象的属性。

虽然可以获取到参数,但是拿过来的字符串其实相当不方便,需要自己编写函数进行优化。

function query(){
//去掉问号
var qs = (location.search.length>0?location.search.substring(1):''); // 用一个空对象来接收键值对
var ar
// 看有没有参数,有就按照&来分割,没有的话就返回空数组
var items = qs.length?qs.split("&"):[];//[a=1,b=2]
console.log("items = " + items);
var item = null,
name = null,
i = 0 ,
len = items.length,
value = null;
for(i=0;i<len;i++) {
//再对每一个项按照等号分割
item = items[i].split("=");//[[a,1],[b,2]]
// name = decodeURIComponent(item[0]);
name = item[0];
value = item[1];
// value = decodeURIComponent(item[1]);
if(name.length) {
args[name] = value;
}
}
return args;
}

四、navigator对象

还没有完全的兼容,但是部分功能依旧强大,概览:

4.1 操作浏览器历史记录的方法

在浏览器中就是左上角的前进后退,JS实现了用代码来管理它们。

history对象,它有一些方法,常用的如下:

history.go(-1);//返回上一页
history.go(1);//前进一页
history.go(2);//前进两页
// 也可以不传参数,简写成
history.back();//后退
history.forward();//前进

如果你不希望用户跳转网页后返回上一页,调用:

window.location.replace("地址");
//这样跳转不能通过浏览器的返回键返回到上一级

最后一个方法,location.reload()

不传参数就在缓存中刷新一遍网页
传true就强制要从服务器重新获取网页

五、第八章小结
这章很多方法都过时了,还有很多兼容ie的方法
重要的几点就是:

location对象和history对象

定时器

第九章

第九章真的没啥好看的,有点浪费时间。

浏览器检测就是为了处理兼容性问题。

我只想说 GTMD IE

以上;

BOM部分笔记整理的更多相关文章

  1. python学习笔记整理——字典

    python学习笔记整理 数据结构--字典 无序的 {键:值} 对集合 用于查询的方法 len(d) Return the number of items in the dictionary d. 返 ...

  2. 从0开始学Swift笔记整理(五)

    这是跟在上一篇博文后续内容: --Core Foundation框架 Core Foundation框架是苹果公司提供一套概念来源于Foundation框架,编程接口面向C语言风格的API.虽然在Sw ...

  3. Deep Learning(深度学习)学习笔记整理系列之(五)

    Deep Learning(深度学习)学习笔记整理系列 zouxy09@qq.com http://blog.csdn.net/zouxy09 作者:Zouxy version 1.0 2013-04 ...

  4. 学习ReactNative笔记整理一___JavaScript基础

    学习ReactNative笔记整理一___JavaScript基础 ★★★笔记时间- 2017-1-9 ★★★ 前言: 现在跨平台是一个趋势,这样可以减少开发和维护的成本.第一次看是看的ReactNa ...

  5. Deep Learning(深度学习)学习笔记整理系列之(八)

    Deep Learning(深度学习)学习笔记整理系列 zouxy09@qq.com http://blog.csdn.net/zouxy09 作者:Zouxy version 1.0 2013-04 ...

  6. Deep Learning(深度学习)学习笔记整理系列之(七)

    Deep Learning(深度学习)学习笔记整理系列 zouxy09@qq.com http://blog.csdn.net/zouxy09 作者:Zouxy version 1.0 2013-04 ...

  7. Deep Learning(深度学习)学习笔记整理系列之(六)

    Deep Learning(深度学习)学习笔记整理系列 zouxy09@qq.com http://blog.csdn.net/zouxy09 作者:Zouxy version 1.0 2013-04 ...

  8. Deep Learning(深度学习)学习笔记整理系列之(四)

    Deep Learning(深度学习)学习笔记整理系列 zouxy09@qq.com http://blog.csdn.net/zouxy09 作者:Zouxy version 1.0 2013-04 ...

  9. Deep Learning(深度学习)学习笔记整理系列之(三)

    Deep Learning(深度学习)学习笔记整理系列 zouxy09@qq.com http://blog.csdn.net/zouxy09 作者:Zouxy version 1.0 2013-04 ...

随机推荐

  1. 【Android Developers Training】 56. 更效率地加载大图片

    注:本文翻译自Google官方的Android Developers Training文档,译者技术一般,由于喜爱安卓而产生了翻译的念头,纯属个人兴趣爱好. 原文链接:http://developer ...

  2. 统计学习方法 三 kNN

    KNN (一)KNN概念: K近邻算法是一种回归和分类算法,这主要讨论其分类概念: K近邻模型三要素: 1,距离: 2,K值的选择: K值选择过小:模型过复杂,近似误差减小,估计误差上升,出现过拟合 ...

  3. js把时间戳转换为普通日期格式

    第一种 function getLocalTime(nS) { return new Date(parseInt(nS) * 1000).toLocaleString().replace(/:\d{1 ...

  4. Spring Security -SpEL表达式

    Spring Security -SpEL表达式 开启SpEL表达式 <!-- use-expressions是否开启 SpEL表达式 o.s.s.web.access.expression.W ...

  5. Vijos 1111 小胖的水果 LCS

    描述 xuzhenyi到大同水果店去买水果,但老板huyichen告诉他每次只能买一种,但是xuzhenyi想吃两种,于是在讨价还价之后,huyichen说只要xuzhenyi能把他想要的两种水果合并 ...

  6. 实现一个简单的Log框架

    实际上算不上框架,只是自己对日志框架的一点理解. 核心接口:Logger,供调用者完成不同等级的日志输出 package com.lichmama.log.service; public interf ...

  7. EF查询百万级数据的性能测试--多表连接复杂查询

    相关文章:EF查询百万级数据的性能测试--单表查询 一.起因  上次做的是EF百万级数据的单表查询,总结了一下,在200w以下的数据量的情况(Sql Server 2012),EF是可以使用,但是由于 ...

  8. Java自学手记——servlet3.0新特性

    servlet3.0出来已经很久了,但市场上尚未普遍应用,servlet3.0有三个比较重要的新特性:使用注解来代替配置文件,异步处理以及上传组件支持. 支持servlet3.0的要求:MyEclip ...

  9. LoadRunner接口工作总结

    因为工作中需要开发维护类似枢纽性质的平台,所以经常利用LR进行接口测试.接口自动化测试.接口压力测试.用多了LR,有点不愿意使用报文编辑器进行手工接口测试了.  接口脚本操作过程: 首先:打开LR,N ...

  10. cognos安装和配置即席报表流程

    安装前的配置: 1.  Cognos数据库的创建和用户的创建 注意:字符集需要设置为UTF-8:Cognos用户权限可以给dba: 2.系统上原有JDK的删除(因为Cognos已经自带JDK) 安装- ...