学习JavaScript第四天
文章目录
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 获取屏幕高度