一:console大法
template:console醒目标识
1. console.log('%c我是炼火鸟的调试信息---》','color:white;font-weight:500;font-size:15px;background:green')
console.log("%c","padding: 50px 300px;line-height:120px;background:url('https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1527605200447&di=cae26a6a9b63f81da7053e385be6acd7&imgtype=0&src=http%3A%2F%2Fimg.pconline.com.cn%2Fimages%2Fupload%2Fupc%2Ftx%2Fphotoblog%2F1110%2F23%2Fc1%2F9365523_9365523_1319332757695_mthumb.jpg') no-repeat;")
console.log("%c代码调试模式==================================>","height:30px;padding:2px 10px;color:white;")
2.console输出分组
console.group("第一组信息"); console.log("第一组第一条"); console.log("第一组第二条"); console.groupEnd(); console.group("第二组信息"); console.log("第二组第一条"); console.log("第二组第二条"); console.groupEnd();
3.三种显示效果的console(chrome浏览器)
console.log('hello'); console.info("这是info"); console.debug("这是debug"); console.warn("这是warn"); console.error("这是error");
4.输出Dom节点的内容 console.dirxml(dom);
5.方法调用轨迹:console.trace()
6.console.time()和console.timeEnd() 配对使用:计算一段代码的运行时间
7.console.count(‘被执行的次数’)
8.console.table() 两层的时候
二:alert
三:debuger之chrome浏览器
1.代码中debugger
2.在浏览器源码处打断点
四:chrome之webstrome