WebAPI

错误回收

try{undefined[1]}catch (e){console.log(e)}

throw关键词处理的是报错

错误类型: EvalError

InternalError

RangeError

ReferenceError

SyntaxError

TypeError

URIError

bash 复制代码
try{throw 1}catch (e){console.log(e)}

1会被e接收

bash 复制代码
try{[][1][1]}catch (e){console.log(e)}finally{console.log('over')}

不报错的话,finally会被执行.

new.target 属性允许你检测函数或构造方法是否是通过new运算符被调用的.

new.target指向被new调用的构造函数,new.成为了一个函数上下文.

bash 复制代码
Foo = function (){if(new.target){console.log('aaaa')}}
Foo();
new Foo();

new.target.可调用函数属性

WebAPI

杂多乱,特点

location是Location的实例化对象

ocation 接口表示其链接到的对象的位置(URL)。所做的修改反映在与之相关的对象上。 Document 和 Window 接口都有这样一个链接的 Location,分别通过 Document.location和Window.location 访问。

location.href 会影响当前页面的url

bash 复制代码
location.herf = 'http://www.xxx'

会进行跳转,location所有内容发生变化.

location + ''

会打印出url ,toString()方法同样

Navigator

Navigator 接口表示用户代理的状态和标识。它允许脚本查询它和注册自己进行一些活动。

可以使用只读的 window.navigator 属性检索 navigator 对象。

字符串属性.

bash 复制代码
navigator.getBattery().then((a)=>{console.log(a);window.battery = a;});

navigator.connection.调用查看也是原型链

navigator.geolocation;获取位置,获取定位.

navigator.geolocation.getCurrentPosition()里面需要一个回调函数.

navigator.hardwareConcurrency;返回计算机cpu的核心数.

bash 复制代码
navigator.keyboard.getLayoutMap().then((a)=>{console.log(a)})

navigator.plugins,浏览器插件

navigator.mimeTypes是插件的一部分

AudioContext音频

bash 复制代码
new AudioContext

document

元素选择器:拿到小节点

元素选择器的方法:

bash 复制代码
document.getElementById
document.getElementsByClassName
document.getElementsByTagName

可以对其进行修改

bash 复制代码
document.getElementsByClassName('hero-copy')[0]
console.dir(document.getElementsByClassName('hero-copy')[0])
document.getElementsByClassName('hero-copy')[0].innerHTML = ''

创建dom节点:

document.creatElement

canvas

通过canvas方法获取显卡信息

bash 复制代码
var canvas = document.createElement('canvas'),
gl = canvas.getContext('experimental-webgl'),
debuginfo = gl.getExtension('webgl_debug_renderer_info');
console.log(gl.getParameter(debuginfo.UNMASKED_RENDERER_WEBGL));
bash 复制代码
// 首先,所有的dom节点一定会继承 HTMLElement和其他特殊类
//  audio标签继承了 HTMLAudioElement和HTMLElement. 具体的继承关系可以通过原型链的方式查看
console.dir(document.createElement('audio'))
document.createElement('audio').__proto__
document.createElement('audio').__proto__.__proto__

document.createElement('a').__proto__
document.createElement('div').__proto__
document.createElement('img').__proto__
// 一个比较简单的例子
a = document.createElement('a')
console.log(a.host)
a.href = 'https://www.XXXX.com';
console.log(a.host)

jquery 快速操作document节点

bash 复制代码
$(".rank_p_rank_3")

debugger;
$.ajax({
  url: "/api/getWeather",
  data: {
    zipcode: XXXX
  },
  success: function( result ) {
    $( "#weather-temp" ).html( "<strong>" + result + "</strong> degrees" );
  }
相关推荐
木斯佳2 小时前
前端八股文面经大全:bilibili生态技术方向二面 (2026-03-25)·面经深度解析
前端·ai·ssd·sse·rag
不会写DN2 小时前
Gin 日志体系详解
前端·javascript·gin
冬夜戏雪3 小时前
实习面经记录(十)
java·前端·javascript
爱学习的程序媛4 小时前
【Web前端】JavaScript设计模式全解析
前端·javascript·设计模式·web
小码哥_常4 小时前
从SharedPreferences到DataStore:Android存储进化之路
前端
老黑4 小时前
开源工具 AIDA:给 AI 辅助开发加一个数据采集层,让 AI 从错误中自动学习(Glama 3A 认证)
前端·react.js·ai·nodejs·cursor·vibe coding·claude code
薛先生_0994 小时前
js学习语法第一天
开发语言·javascript·学习
jessecyj4 小时前
Spring boot整合quartz方法
java·前端·spring boot
苦瓜小生5 小时前
【前端】|【js手撕】经典高频面试题:手写实现function.call、apply、bind
java·前端·javascript
天若有情6735 小时前
前端HTML精讲03:页面性能优化+懒加载,搞定首屏加速
前端·性能优化·html