学习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 获取屏幕高度
学习JavaScript第四天的更多相关文章
- 学习javascript数据结构(四)——树
前言 总括: 本文讲解了数据结构中的[树]的概念,尽可能通俗易懂的解释树这种数据结构的概念,使用javascript实现了树,如有纰漏,欢迎批评指正. 原文博客地址:学习javascript数据结构( ...
- 学习 JavaScript (四)核心概念:操作符
JavaScript 的核心概念主要由语法.变量.数据类型.操作符.语句.函数组成,前面三个上一篇文章已经讲解完了.后面三个内容超级多,这篇文章主要讲解的是操作符. 操作符 什么叫做操作符? 这是一种 ...
- 轻松学习JavaScript十四:JavaScript的RegExp对象(正則表達式)
一RegExp对象概述 RegExp对象表示正則表達式,RegExp是正則表達式的缩写.它是对字符串运行模式匹配的强大工具. RegExp 对象用于规定在文本中检索的内容. 当您检索某个文本时.能够使 ...
- 学习javascript数据结构(三)——集合
前言 总括: 本文讲解了数据结构中的[集合]概念,并使用javascript实现了集合. 原文博客地址:学习javascript数据结构(三)--集合 知乎专栏&&简书专题:前端进击者 ...
- Ext JS学习第五天 我们所熟悉的javascript(四)
此文用来记录学习笔记: •javascript之对象.面向对象 •可能对于高级语言你可能了解甚至精通OOP面向对象,那么对于javascript你又熟悉多少呢?我们一起来学习javascript面向对 ...
- 《如何正确学习JavaScript》读后小结
在segmentfault上读的一篇学习JavaScript路线的文章,做个小结. 一.简介.数据类型.表达式和操作符 (1)<JavaScript权威指南>前言1-2章&< ...
- 一步步学习javascript基础篇(3):Object、Function等引用类型
我们在<一步步学习javascript基础篇(1):基本概念>中简单的介绍了五种基本数据类型Undefined.Null.Boolean.Number和String.今天我们主要介绍下复杂 ...
- 一步步学习javascript基础篇(2):作用域和作用域链
作用域和作用域链 js的语法用法非常的灵活,且稍不注意就踩坑.这集来分析下作用域和作用域链.我们且从几道题目入手,您可以试着在心里猜想着答案. 问题一. if (true) { var str = & ...
- 一步步学习javascript基础篇(1):基本概念
一.数据类型 数据类型 基本数据类型(五种) Undefined Null Boolean Number String 复杂数据类型(一种) Object Undefined:只有一个值undefin ...
- (转)轻松学习JavaScript三:JavaScript与HTML的结合
摘自:http://blog.csdn.net/erlian1992 HTML中的JavaScript脚本必须位于<script>与</script>标签之间,JavaScri ...
随机推荐
- 最佳实践:解读GaussDB(DWS) 统计信息自动收集方案
摘要:现在商用优化器大多都是基于统计信息进行查询代价评估,因此统计信息是否实时且准确对查询影响很大,特别是分布式数据库场景.本文详细介绍GaussDB(DWS)如何实现了一种轻量.实时.准确的统计信息 ...
- 循环Map的几种方法
package cn.jdbc.test;import java.util.HashMap;import java.util.Iterator;import java.util.Map;import ...
- 疫情远程办公Citrix XenDesktop 2203长期稳定版本虚拟云桌面部署教程
下面列出来的是目录大纲,里面包含了Citrix完整搭建的教程,此次实验环境是利用Citrix XenDesktop 7.15 CU3长期稳定版虚拟桌面详细安装教程, 含PVS及UPM相关配置,期待视频 ...
- 一次生产环境mysql迁移操作(一)数据归档
一次生产环境mysql迁移操作(一)数据归档 一次生产环境mysql迁移操作(二)mysql空间释放(碎片整理) 背景 在项目过程中我们经常要对数据库进行迁移.归档.拆分等等操作,现在描述下几种方案 ...
- [nRF24L01+] 3. Radio Control 无线电控制
3. Radio Control 无线电控制 nRF24L01+可以配置为:power down, standby, Rx/Tx mode 3.1. 无线控制状态图 当VDD电压大于1.9V时,进入上 ...
- containerd在线部署
containerd的作用以及跟docker的区别 Containerd是一个用于管理容器生命周期的开源项目.它最初是从Docker项目中分离出来的,现在已经成为了一个独立的项目.它可以用作容器镜像管 ...
- MySQL服务端innodb_buffer_pool_size配置参数
innodb_buffer_pool_size是什么? innodb_buffer_pool是 InnoDB 缓冲池,是一个内存区域保存缓存的 InnoDB 数据为表.索引和其他辅助缓冲区.innod ...
- Go实现常用的排序算法
一.插入排序 1.从第一个元素开始,该元素可以认为已经被排序 2.取出下一个元素,在已经排序的元素序列中从后向前扫描 3.如果该元素(已排序)大于新元素,将该元素移到下一位置 4.重复步骤3,直到找到 ...
- SQL 高级语法 MERGE INTO
根据与源表相联接的结果,对目标表进行插入.更新.删除等操作. 例如,对目标表,如果源表存在的数据则更新,没有的则插入,就可以使用MEREG进行同步. 基本语法 MERGE INTO target_ta ...
- AI假图检测:Deepfake层出不穷,怎么才能“有图有真相”?
随着AIGC技术的迅猛发展,互联网上涌现出各种逼真的篡改照片和视频."有图有真相"已经成为历史.而证件.票据.账单.流水等文件P图这些更为常见的伪造活动,也在AI技术的加持下如虎添 ...