审查元素,可供开发者获得网页各种元素的加载时间、Javascript函数、Object等信息;可以做到定位网页元素、实时监控网页元素属性变化的功能,可以及时调试、修改、定位、追踪检查、查看嵌套 ,修改样式和查看js动态输出信息。
(摘自百度百科)
听起来是不是不明觉厉……那么用通俗的语言说就是“解读一个网页的内容,并可以观测其变化,还可以修改其样式。”
现在论坛很多人就会用审查元素进行恶搞233,我就来教大家如何使用浏览器的审查元素这个功能,当然我不会教得很深XD,教那么深没有用,教到能够用来搞怪就对了DX。

如何打开
Chrome,IE,Edge,360浏览器等众多主流浏览器均装载审查元素这个功能。只需要按下F12,就可以打开审查元素。有些是外载窗口,有些则嵌在浏览器中。当然可以通过审查元素界面中右上角的

打开之后界面如下图所示,我下面用的都是论坛主页,也就是http://www.mcbbs.net/forum.php。


解读内容
你可以将鼠标移动到其上方窗格的代码来进行观察,同时观察网页变化。你会发现,鼠标指针指到一些地方,网页中一些地方会变成蓝色。没错,你指的地方就是网页中的这一个部分,如下图所示。

一个网页分为用于深度展示网页类型等的<head>以及展示内容的<body>,body内容大体又分为头、中、尾,可以看到目前的情况就是分层展示(一般在打开的时候会帮你自动列出<body>)。
想打开更深的就需要展开这之中的内容。例如我想定位到综合问答的主题数:
从最开始的<body>入手,到<div class="mc_map_wp">,点开其左方的向右箭头,就可以看到这之中的内容。用鼠标指针一个一个浏览就可以知道它分为顶部(<div id="mc_map_topleft">)以及中部(<div id="mc_map_borderleft">),点开中部,再如上方法一样展开<div id="mc_map_borderright">,<div id="mc_body_color">,<div id="wp" class="wp">,再找到为中部内容的<div id="ct" class="wp cl ct2">,这时又分为顶部,左,右三个部分。

再点开为版块浏览的<div class="fl bm">,找到”“你问我答”大区的部分(<div class="bm bmw flg cl">)并点开。

点开这之中的内容部分,找到表格中第一行第一个,再找到对应描述所符合的第二行,恭喜你,你找到了!现在你列开的代码如下图所示!


修改内容
既然你找到了一个地方,就可以修改其内容。当然你修改的情况只会在你的电脑中如此显示,其他人并不会接收到你所修改的内容(除非你通过手段分享),刷新之后你修改的内容就会消失。
例如我想把刚刚选择到的主题数改为2,你可以双击这一行代码“<em>主题: 34327</em>”中的“主题: 34327”,并修改,就行了。
如此,很多代码都可以像这样被修改。你还可以删除、增加等情况,但是在这里不一一说明。

示例:论坛荒废的正确方式:

才不会告诉你我的性别和生日就是这么搞的。
附:

很正常对吧