devTools 调试技巧

  • cmd + 或者 cmd - 可以调整 devTools 的字体大小
  • cmd + shift + c 选中或者覆盖层 然后删掉
  • 控制台,0.play(),$0.playbackRate = 2;可以控制视频,
  • 复制样式,右键所选元素,点击复制样式
  • 下载当前页面所有图像
$$("img").forEach(async (img) => {
	try {
		const src = img.src;
		// Fetch the image as a blob.
		const fetchResponse = await fetch(src);
		const blob = await fetchResponse.blob();
		const mimeType = blob.type;
		// Figure out a name for it from the src and the mime-type.
		const start = src.lastIndexOf("/") + 1;
		const end = src.indexOf(".", start);
		let name = src.substring(start, end === -1 ? undefined : end);
		name = name.replace(/[^a-zA-Z0-9]+/g, "-");
		name += "." + mimeType.substring(mimeType.lastIndexOf("/") + 1);
		// Download the blob using a <a> element.
		const a = document.createElement("a");
		a.setAttribute("href", URL.createObjectURL(blob));
		a.setAttribute("download", name);
		a.click();
	} catch (e) {}
});
  • 跳过 Debugger,右键 Debugger,点击 Never pause here.
  • 重新发送请求,右键 点击 以 fetch 格式复制 到控制台输入
  • cmd + shift + M 进入模拟设备模式
  • 调试下拉框

参考文章