汇编 无法修改显存中的内容_如何修改网页中的内容？

注意：请勿将本文中提到的技术用于违法行为，因此造成的损失我不承担任何责任。

简介

之前在内测群里聊天，我才发现几乎没有人知道如何修改一个网页中的内容，除了相关领域。可能是因为我已经接触了前端的一些知识，所以默认很多人都了解。

本文会总结几种简单的修改页面内容的方式。我会用比较简单的描述，毕竟这个知识点对于大多数前端是必备的，懂的自然懂。

一些简单的知识点

什么是网页？

网页是你通过浏览器或应用内访问到的一个界面，是由若干代码构成的。这里的代码并不复杂，如果你对编程语言有一定的了解，你可以认为这个页面中的代码是标识型的，而不是类似C语言中的逻辑。我们使用若干个元素标签标记页面中的内容。

修改网页内容会修改实际的内容吗？

你能看到的绝大多数页面都是已经被加载完毕的，换句话说，在使用过程中，它是一个相对的静态页面。静态页面中的内容虽然是固定的，但是其绝大部分数据的来源依然是服务器传递过来的数据。这个技术不会也不能修改服务器动态传递的数据，也不能修改服务器中的数据，更不能将修改后的数据传回服务器（非用户输入的情况下），只能修改已经被加载完毕的静态数据。

所以，从技术上来说，它是安全的，但是不要将这项技术用于违法用途。

开始

准备

• 一台电脑（任意操作系统）
• 基于Chrome内核的浏览器

这里需要解释一下，Chrome是谷歌旗下的一款浏览器，其内核为开源，很多浏览器使用的也是Chrome内核，例如Edge。

如果你的浏览器不是基于Chrome内核，部分操作可能会与本文不同，但是思路是相同的。

如果你不清楚你的浏览器是什么内核，可以阅读其官网的内容，或者是安装Chrome。

开启调试

在浏览器中，摁下 F12 键。

我们的界面右侧会出现一个额外的区域，显示着复杂的代码，这就是我们的调试工具。

在不同的浏览器中，调试工具可能会有不同的名字，甚至是有不同的开启方法。

方法1 元素检查

元素检查是开发时很好用的工具，便于定位元素及修改。

如图，选择左上角的按钮，

当我们再次移动鼠标时，界面会发生一些变化。

此时我们的鼠标会自动显示所在区域的元素，通过单击来选择元素。

在单击后，会自动退出元素检查，同时会自动定位右边的代码。

双击“43.78”，即可对这个数字进行修改，通过回车确定，

与此同时，页面内的元素会发生相同的变化。

通过这种方式，可以修改任意元素的文本内容。

如果你了解的更多，其实可以通过这种方式完全修改这个页面。

方法2 Javascript调试

这一次，我们要选择控制台选项卡。

输入命令：

document.body.contentEditable="true"

按下回车以确定，

此时我们已经进入了类似的编辑模式。

如果我没记错的话，这段代码有一个小问题，就是会导致页面重复出现波浪线，即拼写错误，修复的话需要在浏览器设置内关掉文本检查的功能。

当然，如果没有发生，那就当我没说过。

输入命令：

document.designMode='on'

可以实现相同的效果，不再重复了。

用途

用途，一定是非常广泛了。正如我在开始提到的，这本身是前端开发必不可少的一个工具，同样的，也可以做很多事，尤其是一些恶趣味。

你们月入过百万的进来挨打

最后表演一个绝活，随心所欲地修改支付宝的余额：

最后

不要尝试做违法的事。