1 回顾 内置对象

1. Number
2. String
3. Math
4. Date
5. Array

2 内置对象

2.1 Function

Function 是所有函数的构造函数,Function 也是自己的构造函数,Function 实例的属性方法:

length		获取形参的数量

call()		调用函数并设置里面的this,第二个参数开始后面的参数都是给函数的
apply() 调用函数并设置里面的this,第二个参数是数组,数组中的元素作为函数的函数
bind() 返回被设置了this的新函数

2.2 Global

ECMAScript 标准中规定了一个全局对象 Global,像 Array、Number、 String、isNaN、isFinite 等都是 Global 的属性。

浏览器上存在 window 对象,向alert、prompt 等都是 window 的属性,运行在浏览器上的 JS,Global 就是 window。

eval()					参数是字符串,将字符串作为代码执行
encodeURI() 对URL进行编码
decodeURI() 对编码后的URL进行解码

3 DOM 部分知识点介绍

DOM 全称 Document Object Model,译为文档对象模型。

DOM 是 HTML 文档为 JavaScript 提供的能够对 HTML 文档进行相关操作的 API。

1. 获取元素
document.getElementById() 2. 给元素添加事件
元素对象.oncilck = function() {}; 3. 设置元素的 CSS 样式
元素对象.style.属性名 = '值'; 4. 设置元素中的文字内容
元素对象.innerHTML = '内容';

4 BOM

BOM 全称 Browser Object Model,译为浏览器对象模型。

BOM 是浏览器为 JavaScript 提供的能够对浏览器进行相关操作的 API。

4.1 window

window 表示浏览器窗口,打开页面的时候会自动创建; 运行在浏览器上的 JS,window 是全局对象, 所有的全局变量都是 window 的属性,使用 window 的属性可以省略 window.

① 弹框

// 警告框  没有返回值
alert() // 确认框 返回布尔值
confirm() // 输入框 返回用户输入的内容(string)
prompt()

② 打开关闭窗口

open()		打开新窗口
close() 关闭本窗口,要求该窗口必须是 open 打开的
// 打开空白窗口
open(); // 打开新窗口 指定网页
open('网页地址'); // 在指定的窗口打开网页
open('网页地址', '窗口名称'); // 打开新窗口指定尺寸
open('网页地址', '', 'width=400,height=300')

③ 页面滚动

scrollTo()		页面滚动到指定位置,设置坐标
scrollBy() 页面滚动指定距离,设置距离
// 设置两个参数作为坐标
scrollTo(0, 0); // 设置一个参数,该参数是对象
scrollTo({
left: 0,
top: 0,
behavior: 'smooth'
}); // 设置两个参数作为滚动的距离
scrollBy(100, 100); // 设置一个参数,该参数是对象
scrollBy({
top: 600,
behavior: "smooth"
});

④ 定时器

多次定时器:

setInterval(回调函数, 时间间隔)		时间间隔单位是毫秒,默认值是 0, 返回定时器标记
clearInterval(定时器标记) 停止定时器,指定定时器标记

单次定时器:

setTimeout(回调函数, 时间间隔)		时间间隔单位是毫秒,默认值是 0, 返回定时器标记
clearTimeout(定时器标记) 停止定时器,指定定时器标记

⑤ window 对象属性和方法总结

name			窗口的名字,可读可写
innerWidth 读取视口的宽度
innerHeight 读取视口的高度
document 获取文档对象 DOM对象
history
location
navigator
screen alert()
confirm()
prompt()
open()
close()
scrollTo()
scrollBy()
setTimeout()
setInterval()
clearTimeout()
clearInterval()

4.2 history

history 表示本窗口的历史记录, 相关属性方法如下:

length			获取本窗口历史记录的数量

back()			回到历史记录上一个
forward() 回到历史记录下一个
go() 设置一个数字作为参数,正数前进,负数后退

4.3 location

location 表示本窗口的地址信息,相关属性方法如下:

href		完整的url,可读可写
protocol 协议部分,可读可写
hostname 主机名,可读可写
port 端口号,可读可写
host 主机名和端口号,可读可写
pathname 文件路径,可读可写
hash 锚点信息,可读可写
search 参数信息,可读可写 reload() 刷新页面
assign() 页面跳转,设置一个地址作为参数,留下历史记录
repalce() 页面跳转,设置一个地址作为参数,不会留下历史记录

4.4 navigator

navigator 用于表示浏览器版本信息以及操作系统信息,属性如下:

userAgent		获取客户端浏览器信息

4.5 screen

screen 用于表示屏幕相关信息,属性如下:

width		获取屏幕宽度
height 获取屏幕高度

学习JavaScript第四天的更多相关文章

  1. 学习javascript数据结构(四)——树

    前言 总括: 本文讲解了数据结构中的[树]的概念,尽可能通俗易懂的解释树这种数据结构的概念,使用javascript实现了树,如有纰漏,欢迎批评指正. 原文博客地址:学习javascript数据结构( ...

  2. 学习 JavaScript (四)核心概念:操作符

    JavaScript 的核心概念主要由语法.变量.数据类型.操作符.语句.函数组成,前面三个上一篇文章已经讲解完了.后面三个内容超级多,这篇文章主要讲解的是操作符. 操作符 什么叫做操作符? 这是一种 ...

  3. 轻松学习JavaScript十四:JavaScript的RegExp对象(正則表達式)

    一RegExp对象概述 RegExp对象表示正則表達式,RegExp是正則表達式的缩写.它是对字符串运行模式匹配的强大工具. RegExp 对象用于规定在文本中检索的内容. 当您检索某个文本时.能够使 ...

  4. 学习javascript数据结构(三)——集合

    前言 总括: 本文讲解了数据结构中的[集合]概念,并使用javascript实现了集合. 原文博客地址:学习javascript数据结构(三)--集合 知乎专栏&&简书专题:前端进击者 ...

  5. Ext JS学习第五天 我们所熟悉的javascript(四)

    此文用来记录学习笔记: •javascript之对象.面向对象 •可能对于高级语言你可能了解甚至精通OOP面向对象,那么对于javascript你又熟悉多少呢?我们一起来学习javascript面向对 ...

  6. 《如何正确学习JavaScript》读后小结

    在segmentfault上读的一篇学习JavaScript路线的文章,做个小结. 一.简介.数据类型.表达式和操作符 (1)<JavaScript权威指南>前言1-2章&< ...

  7. 一步步学习javascript基础篇(3):Object、Function等引用类型

    我们在<一步步学习javascript基础篇(1):基本概念>中简单的介绍了五种基本数据类型Undefined.Null.Boolean.Number和String.今天我们主要介绍下复杂 ...

  8. 一步步学习javascript基础篇(2):作用域和作用域链

    作用域和作用域链 js的语法用法非常的灵活,且稍不注意就踩坑.这集来分析下作用域和作用域链.我们且从几道题目入手,您可以试着在心里猜想着答案. 问题一. if (true) { var str = & ...

  9. 一步步学习javascript基础篇(1):基本概念

    一.数据类型 数据类型 基本数据类型(五种) Undefined Null Boolean Number String 复杂数据类型(一种) Object Undefined:只有一个值undefin ...

  10. (转)轻松学习JavaScript三:JavaScript与HTML的结合

    摘自:http://blog.csdn.net/erlian1992 HTML中的JavaScript脚本必须位于<script>与</script>标签之间,JavaScri ...

随机推荐

  1. git 如何在本地同步远程已经删除的分支

    背景 因为分支管理,release/*是被保护的,除非是已经合并到master才会被删除.所以这个时候本地存在已经删除的releas/*分支. 此时会发现,怎么都删除不了这些保护分支.留着也没意思,该 ...

  2. Kotlin 布尔值教程:深入理解与应用示例

    Kotlin 布尔值 在编程中,您经常需要一种只能有两个值的数据类型,例如: 是 / 否 开 / 关 真 / 假 为此,Kotlin 有一种布尔数据类型,可以取 true 或 false 值. 布尔值 ...

  3. Python 将Word转换为JPG、PNG、SVG图片

    将Word文档以图片形式导出,既能方便信息的分享,也能保护数据安全,避免被二次编辑.文本将介绍如何使用Spire.Doc for Python 库在Python程序中实现Word到图片的批量转换. P ...

  4. php json_decode 和json_encode

    json_decode (PHP 5 >= 5.2.0, PECL json >= 1.2.0) json_decode - 对 JSON 格式的字符串进行编码 说明 mixed json ...

  5. CF506D题解

    Mr. Kitayuta's Colorful Graph 算法:根号分治. 题目大意先说一下:给一个 \(n\) 点 \(m\) 边的无向图,边有颜色.\(q\) 组询问,每次给出 \(u,v\), ...

  6. SMU Spring 2023 Contest Round 4(第 21 届上海大学程序设计联赛 春季赛)

    A. Antiamuny wants to learn binary search 签到题. #include <map> #include <set> #include &l ...

  7. Vim 全局配置 / 设置鼠标模式

    新搞的 Linux (Debian) 上的 vim 一右击粘贴就变成 insert (Visual) 模式,上网查了一下,要 set mouse=,但是每次设置太麻烦了,另外我也想改一下全局配色. 定 ...

  8. Linux 内核相关命令

    Shell 命令: ipcs # 查看共享内存 dmesg # 显示内核消息 sudo dmesg -c # 清空内核消息 sudo mknod /dev/rwbuf c 60 0 sudo insm ...

  9. JMeter手机app录制

    在移动应用的性能测试中,如何准确.全面地捕捉用户操作并生成可复用的测试脚本,始终是测试工程师面临的一大挑战.而JMeter,作为一款功能强大的开源性能测试工具,不仅在Web测试中表现优异,在手机App ...

  10. Docker网络下-自定义网络实战

    通过前面两篇的学习,我们对docker网络及四大网络类型都了解了.本文,咱们就来学习docker的自定义网络.我们为什么需要自定义网络呢?是为了让各个主机分门别类,井井有条.方便关联,使得网络之间可以 ...