修改网站内容(之前会总结几种简单的修改页面内容的方式吗？)

　　修改网站内容(之前会总结几种简单的修改页面内容的方式吗？)

　　注意：请不要将本文提及的技术用于非法活动，因此造成的损失我不承担任何责任。

　　介绍

　　之前在内测群聊的时候，发现几乎没有人知道怎么修改网页的内容，除了相关的字段。可能是因为接触过一些前端知识，所以很多人默认都知道。

　　本文将总结几种简单的修改页面内容的方法。我会用一个比较简单的描述，毕竟这个知识点对于大多数前端来说都是必须的，自然理解。

　　一些简单的知识点

　　什么是网页？

　　网页是您通过浏览器或应用程序访问的界面，由许多代码组成。这里的代码并不复杂。如果你对编程语言有一定的了解，你可以认为这个页面上的代码是logotype，而不是类似于C语言中的逻辑。我们使用几个元素标签来标记页面上的内容。

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

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

　　因此，它在技术上是安全的，但不要将此技术用于非法目的。

　　开始

　　准备

　　这里需要说明一下，Chrome是谷歌旗下的浏览器。它的内核是开源的。许多浏览器也使用 Chrome 内核，例如 Edge。

　　如果你的浏览器不是基于Chrome内核的，有些操作可能与本文有所不同，但思路是一样的。

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

　　开启调试

　　在浏览器中，按 F12 键。

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

　　在不同的浏览器中，调试工具可能有不同的名称，甚至有不同的打开方式。

　　方法一元素检查

　　元素检查是开发过程中非常有用的工具，易于定位元素和修改。

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

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

　　这时候我们的鼠标会自动显示区域内的元素，点击选中元素。

　　点击后会自动退出元素检查，自动定位到右边的代码。

　　双击“43.78”修改这个数字，回车确认，

　　同时，页面内的元素也会发生同样的变化。

　　这样就可以修改任何元素的文本内容。

　　如果您了解更多，您实际上可以通过这种方式完全修改此页面。

　　方法二 Javascript 调试

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

　　输入命令：

　　document.body.contentEditable="true"

　　按 Enter 确认，

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

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

　　当然，如果没有发生，就当我没说的那样对待。

　　输入命令：

　　document.designMode='on'

　　可以达到同样的效果，这里不再赘述。

　　用

　　用途必须非常广泛。正如我开头提到的，这是前端开发不可或缺的工具。同样，它可以做很多事情，尤其是一些坏品味。

　　过百万的你进来挨打

　　最后施展绝招，随心修改支付宝余额：

　　最后

　　不要试图做一些非法的事情。