JS Web API

一、约束验证 DOM 方法

属性	描述
checkValidity()	如果 input 元素包含有效数据，则返回 true。
setCustomValidity()	设置 input 元素的 validationMessage 属性。

二、约束验证 DOM 属性

属性	描述
validity	包含与输入元素有效性相关的布尔属性。
validationMessage	包含当有效性为 false 时浏览器将显示的消息。
willValidate	指示是否将验证 input 元素。

三、有效性属性

input 元素的有效性属性包含许多与数据有效性相关的属性：

属性	描述
customError	如果设置了自定义有效性消息，则设置为 true。
patternMismatch	如果元素的值与其 pattern 属性不匹配，则设置为 true。
rangeOverflow	如果元素的值大于其 max 属性，则设置为 true。
rangeUnderflow	如果元素的值小于其 min 属性，则设置为 true。
stepMismatch	如果元素的值对其 step 属性无效，则设置为 true。
tooLong	如果元素的值超过其 maxLength 属性，则设置为 true。
typeMismatch	如果元素的值对其 type 属性无效，则设置为 true。
valueMissing	如果元素（具有 required 属性）没有值，则设置为 true。
valid	如果元素的值有效，则设置为 true。

四、History 对象属性

属性	描述
length	返回历史列表中的 URL 数量。

五、History 对象方法

方法	描述
back()	加载历史列表中的上一个 URL。
forward()	加载历史列表中的下一个 URL。
go()	从历史列表中加载特定的 URL。

六、Storage 对象属性和方法

属性/方法	描述
key(n)	返回存储中第 n 个键的名称。
length	返回存储在 Storage 对象中的数据项数。
getItem(keyname)	返回指定的键名的值。
setItem(keyname, value)	将键添加到存储中，或者如果键已经存在，则更新该键的值。
removeItem(keyname)	从存储中删除该键。
clear()	清空所有键。

七、Web Storage API 相关页面

属性	描述
window.localStorage	允许在 Web 浏览器中保存键/值对。存储没有到期日期的数据。
window.sessionStorage	允许在 Web 浏览器中保存键/值对。存储一个会话的数据。

八、什么是 Web Worker

在 HTML 页面中执行脚本时，页面在脚本完成之前是无响应的。

Web Worker 是在后台运行的 JavaScript，独立于其他脚本，不会影响页面的性能。你可以继续做任何你想做的事情：点击、选取内容等，同时 web worker 在后台运行。

九、 Fetch API

Fetch API 接口允许 Web 浏览器向 Web 服务器发出 HTTP 请求。

不再需要 XMLHttpRequest。

十、Web Geolocation API

getCurrentPosition() 方法 - 返回数据

getCurrentPosition() 方法在成功时返回一个对象。会始终返回纬度、经度和精度属性。如果可用，则返回其他属性：

属性	返回
coords.latitude	以十进制数表示的纬度（始终返回）。
coords.longitude	以十进制数表示的经度（始终返回）。
coords.accuracy	位置精度（始终返回）。
coords.altitude	平均海平面以上的高度（以米计）（如果可用则返回）。
coords.altitudeAccuracy	位置的高度精度（如果可用则返回）。
coords.heading	从北顺时针方向的航向（如果可用则返回）。
coords.speed	以米/秒计的速度（如果可用则返回）。
timestamp	响应的日期/时间（如果可用则返回）。

Geolocation 对象 - 其他有趣的方法

Geolocation 对象还有其他有趣的方法：

watchPosition() - 返回用户的当前位置，并随着用户移动（如汽车中的 GPS）继续返回更新的位置。
clearWatch() - 停止 watchPosition () 方法。

下面的例子展示了 watchPosition() 方法。

JS Web API相关推荐

解答网友提问 | 使用VS2022快速生成React/Angular/Vue.js + Web API前后端集成项目
前言上次发表了<一键生成Vue.js + Web API前后端集成项目>后,有多位网友来问,有不有其他的前后端集成模板: 实际上,VS2022没有提供前后端集成项目模板. 但是,使用VS ...
一键生成Vue.js + Web API前后端集成项目
前言默认情况下,Visual Studio提供了"基于Vue.js Web 应用程序"项目模板,可以生成Vue.js前端项目. 你需要另外创建Web API项目,调试时需要同时启 ...
[JavaScript]为JS处理二进制数据提供可能性的WEB API
写这篇博客的起源是在div.io上的一篇文章<你所不知道的JavaScript数组>by 小胡子哥下的评论中的讨论. 因为随着XHR2和现代浏览器的普及,在浏览器当中处理二进制不再向过去那 ...
【ASP.NET Web API教程】2.3.5 用Knockout.js创建动态UI
[ASP.NET Web API教程]2.3.5 用Knockout.js创建动态UI 原文:[ASP.NET Web API教程]2.3.5 用Knockout.js创建动态UI 注:本文是[ASP ...
ASP.NET Core 实战：使用ASP.NET Core Web API 和 Vue.js 搭建前后端分离项目
一.前言这几年前端的发展速度就像坐上了火箭,各种的框架一个接一个的出现,需要学习的东西越来越多,分工也越来越细,作为一个 .NET Web 程序猿,多了解了解行业的发展,让自己扩展出新的技能树,对自 ...
api怎么写_使用Node.js原生API写一个web服务器
Node.js是JavaScript基础上发展起来的语言,所以前端开发者应该天生就会一点.一般我们会用它来做CLI工具或者Web服务器,做Web服务器也有很多成熟的框架,比如Express和Koa.但 ...
通过Web Api 和 Angular.js 构建单页面的web 程序
在传统的web 应用程序中,浏览器端通过向服务器端发送请求,然后服务器端根据这个请求发送HTML到浏览器,这个响应将会影响整个的页面,比如说:用户通过一个连接导航到一个页面,会发送一个请求到服务器端, ...
基于 Node.js + Koa 构建完整的 Web API （配置 ESLint 和使用 Airbnb 编码规范）
主题内容:基于 Node.js + Koa 构建完整的 Web API (配置 ESLint 和使用 Airbnb 代码规范) 背景描述:上一篇基于 Node.js + Koa 构建完整的 Web ...
JavaScript--JavaScript和web API、JS（提供案例）
本文来自pink老师前端学习视频,作为自己的学习笔记文章目录引言一.组成部分二.API和Web API 三.DOM 1. DOM简介 2. 获取元素 3. 事件四.操作元素 1. 改变元素内 ...