怎么利用浏览器的开发者工具来修改网页的内容

  • 原创
  • |
  • 浏览：10532
  • |
  • 更新：
  • 怎么利用浏览器的开发者工具来修改网页的内容1
  • 怎么利用浏览器的开发者工具来修改网页的内容2
  • 怎么利用浏览器的开发者工具来修改网页的内容3
  • 怎么利用浏览器的开发者工具来修改网页的内容4
  • 怎么利用浏览器的开发者工具来修改网页的内容5
  • 怎么利用浏览器的开发者工具来修改网页的内容6
  • 怎么利用浏览器的开发者工具来修改网页的内容7
分步阅读

我们使用浏览器的时候会看到一个开发者工具，那么这么开发者工具有什么作用呢？

开发者工具可以用来修改网页的内容，我们一起来试试吧！

工具/原料

  • 电脑
  • 浏览器中的开发者工具

方法/步骤

  1. 1

    打开任意一浏览器，谷歌，火狐，ie等浏览器都可以，这里以windows 10版本的Microsoft Edge浏览器为例。

    怎么利用浏览器的开发者工具来修改网页的内容
  2. 2

    点击选择任意网页，如百度搜索的网页。

    怎么利用浏览器的开发者工具来修改网页的内容
  3. 3

    打开浏览器设置，选择开发者工具，或者通过F!2快捷键打开开发者工具。如图1。

    怎么利用浏览器的开发者工具来修改网页的内容
  4. 4

    开发者工具界面，主要关注元素菜单栏的定位图标。如图2.

    怎么利用浏览器的开发者工具来修改网页的内容
  5. 5

    1、点击开发者工具里的定位图标，

    2、选择要改变的网页内容，该图标会把网页内容的代码显示出来。如图3：百度搜索里的换肤两个字。

     

     

    怎么利用浏览器的开发者工具来修改网页的内容
  6. 6

    在开发者工具界面右键选择“编辑html”功能，就可以编辑该内容了。例如我把百度搜索里的换肤两个字改为皮肤。如图4.

     

    怎么利用浏览器的开发者工具来修改网页的内容
  7. 7

    效果

    怎么利用浏览器的开发者工具来修改网页的内容
    END

注意事项

  • 帮忙点个赞呗！
经验内容仅供参考，如果您需解决具体问题(尤其法律、医学等领域)，建议您详细咨询相关领域专业人士。
作者声明：本篇经验系本人依照真实经历原创，未经许可，谢绝转载。
展开阅读全部