箭头:用来选择所需要的HTML元素,通过HTML元素定位到Elements中的对应代码。
切换:用来在手机模式和电脑模式之间做切换的。
Elements:主要用来查看最终渲染情况,CSS样式的修改和绑定事件的定位。
left:结构面板。显示的是渲染出来页面的最终代码,包括JS渲染在内。
style:添加修改样式和类。模拟元素的hover等属性的操作。
computed:模型最后的计算情况与应用到的样式,在上面可以很容易直观修改盒子模型的参数。
events:获取选择元素的对应绑定事件的执行为之和触发的事件情况。
dom:断点审查情况,这个属性不常用。
properties:对应选中的元素调用到JS底层的对象情况,这个属性基本没有使用。
Console调试台:主要是用来打印输出内容,获取报错信息,页面调试内容(仅用于对在window对象中存在的对象或者变量,函数才可以使用)。
打印输出内容
获取报错信息
页面调试内容
//利用console中删除在百度推广广告 //删除iframe广告内容 var iframecount=document.getElementsByTagName("iframe").length; for(var i=iframecount;i>=0;i--){ var do1=document.getElementsByTagName("iframe")[i]; if(do1 == null){ }else{ //do1.style.display="none"; do1.parentNode.removeChild(do1); } } //删除内嵌的广告占位,有的用上面的去除iframe后还有占位,需要再执行下 var inscount=document.getElementsByTagName("ins").length; for(var i=inscount;i>=0;i--){ var do1=document.getElementsByTagName("ins")[i]; if(do1 == null){ }else{ //do1.style.display="none"; do1.parentNode.removeChild(do1); } }