window 对象 | 表示浏览器窗口，提供窗口尺寸等信息 | console.log('window inner size: ' + window.innerWidth + ' x ' + window.innerHeight); |
navigator 对象 | 包含浏览器的信息，如名称、版本等 | console.log('appName = ' + navigator.appName); |
screen 对象 | 包含屏幕的尺寸和颜色深度等信息 | console.log('Screen size = ' + screen.width + ' x ' + screen.height); |
location 对象 | 包含当前页面的URL信息，可以操作浏览器地址 | location.href = 'http://www.example.com'; |
document 对象 | 表示当前页面的DOM树，提供DOM操作的方法。 | document.title = '新标题'; |
| DOM操作 | 包括更新、遍历、添加、删除DOM节点 | let p = document.getElementById('p-id'); p.innerHTML = '新内容'; |
| 表单操作 | 通过JavaScript操作表单，获取或设置输入值 | let input = document.getElementById('email'); input.value = '新邮箱地址'; |
| 文件操作 | 使用<input type="file">上传文件，并通过File API读取文件内容 | let fileInput = document.getElementById('test-file-upload'); |
| AJAX | 通过JavaScript发送异步HTTP请求，更新页面部分内容 | let xhr = new XMLHttpRequest(); xhr.open('GET', 'url', true); xhr.send(); |
| Promise | 用于异步计算，提供成功和失败处理的链式调用 | new Promise((resolve, reject) => { ... }).then(result => { ... }).catch(error => { ... }); |
| async/await | 简化异步操作的语法，使异步代码看起来像同步代码 | async function fetchData(url) { let response = await fetch(url); return response.json(); } |
| Canvas | HTML5新增的绘图元素，使用JavaScript绘制图形和动画 | let canvas = document.getElementById('myCanvas'); let ctx = canvas.getContext('2d'); ctx.fillRect(10, 10, 100, 100); |