浏览器与控制台的使用

常见的浏览器内核

• webkit:chrome;opera >14 ;国产浏览器、手机浏览器
• trident:IE IE EDGE是trident+Chrome mini
• gecko:Firefox
• presto：opera <14

控制台经常使用的工具

• Elements：查看页面的结构
• Console：查看输出结果和报错信息
• Source：查看网页的源码
• Network：查看当前网页的网络请求信息（http报文、加载时间等）
• Application：查看网页的数据和文件资源

经常使用的控制台输出命令

• console类
  • console.log：原来是什么结构就输出什么
  • console.dir：输出一个对象的详细键值对信息
  • console.table：将一个多维的数组按照表格的方式在控制台输出

let persons={
		name:'rose',
		gender:'female'
	}
	console.log(persons)//{name: "rose", gender: "female"}
	console.dir(persons)//Object gender: "female" name: "rose"

let persons={
		names:['rose','jack','lucy']
	}
	console.table(persons)

<img src=https://img2018.cnblogs.com/blog/1779093/201911/1779093-20191127193221076-1984542148.png>

• alert/confirm确认取消：选择型弹框/prompt：在confirm的基础上加一个输入框
  • 输出的结果都先调用toString方法转换为字符串
  • 都会阻断JS代码的执行，只有当窗口关闭，JS才会继续运行

JavaScript代码的位置

• 放到body中的底部：为了保证页面结构加载完成后再执行JS代码操做页面的元素（放到头部有可能没法得到须要操做的元素）
• 放到body的头部+window.onload事件(该事件当页面中的结构和内容都加载完成后才出发)。注意与document.ready的区别(只要结构加载完成就触发)