基础课专题——页面中常用的几种输出方式

爱被打了一巴掌 2022-06-08 00:44 345阅读 0赞

### 页面中常用的几种输出方式 ###

--------------------

#### 在控制台输出： ####

console.log(“内容”)；

*  Elements：页面中的元素都在其中，经常用这个元素来调试样式
 *  Network：包含所有的资源文件（css外链文件、js外链文件、html页面、所有图片、向后台请求的数据接口），并告诉我们每一个文件加载完成的时间。（对于时间过长的需要进行优化）
 *  Sources：包含项目中的html、css、js所有的源码。（扒一个网站可以在这个找到所有的源码）
 *  Resources：当前网站本地存储的数据都在这里（cookie、storage）
 *  Console：页面在控制台输出的内容

console.dir(“内容”); 在控制台输出一个对象的详细信息  
console.table(); 把一个数据（json）按照表格的形式输出，查看时更加清晰一些  
可以用控制台加断点来进行bug调试

--------------------

#### 给页面中的某一个元素来添加内容： ####

innerText / innerHTML，如：

var oDiv = document.getElementById("div1");
    oDiv.innerText = "abc";
    //或者：
    oDiv.innerHTML = "abc";

两者区别：

*  firefox不支持innerText，只支持innerHTML。innerHTML不存在浏览器兼容问题
 *  innerHTML不仅可以添加文字，还可以添加html标签

项目中统一使用innerHTML，基本不用innerText

--------------------

#### 在页面中弹出对应的框来显示内容： ####

*  alert(“内容”); 把要输出的内容先转为字符串，然后再输出
 *  confirm(); 是浏览器中默认选择弹出层，选择“确定”会返回true，“取消”返回false，通过返回值进行相关操作。

--------------------

#### 在页面中输出内容： ####

document.write(“abc”);  
如果要在页面中添加一个广告的话，用这个加

发表评论取消回复

表情：

评论列表（有 0 条评论，345人围观）

还没有评论，来说两句吧...

相关阅读

相关 JS输出数据的几种方式

【①window.alert() ：弹出警告框】 <script>window.alert(1010);</script> window.alert(10+1

谁践踏了优雅/ 2023年10月05日 13:03/ 0 赞/ 15 阅读

相关前端页面间数据传递常用的几种方式

1、常用方式 url页面路径携带参数传递 localStorage方式传递 sessionStorage方式传递 cookie的方式传递 2、

「爱情、让人受尽委屈。」/ 2022年10月01日 06:59/ 0 赞/ 239 阅读

相关详解SQL中几种常用的表连接方式

![e11253e75e3451d7d4b90db0073ac2c0.gif][] 「数仓宝贝库」，带你学数据！导读：数据库性能优化最主要的就是SQL优化，SQL优化的关

﹏ヽ暗。殇╰゛Y/ 2022年09月09日 14:45/ 0 赞/ 205 阅读

相关 js页面跳转常用的几种方式

第一种：复制代码代码如下: <script language="javascript" type="text/javascript"> window.

布满荆棘的人生/ 2022年08月06日 05:15/ 0 赞/ 268 阅读

相关基础课专题——页面中常用的几种输出方式

页面中常用的几种输出方式 -------------------- 在控制台输出： console.log(“内容”)； Elements：页面中的元素都

爱被打了一巴掌/ 2022年06月08日 00:44/ 0 赞/ 346 阅读

相关 Golang:import常用的几种方式

用法点操作点操作就是导入这个包后可以直接省略包名调用函数,`不建议使用` package main import (

桃扇骨/ 2022年05月22日 07:10/ 0 赞/ 223 阅读

相关几种常用的数据校验方式

我们知道数据在传输过程中，可能会存在数据出错的情况。为了保证数据传输的正确性，因此会采取一些方法来判断数据是否正确，或者在数据出错的时候及时发现进行改正。常用的几种数据校验方式

素颜马尾好姑娘i/ 2022年04月01日 06:39/ 0 赞/ 1343 阅读

相关几种页面跳转的方式

页面跳转 1. 用<a>标签<a href=""></a> 2. 用window.location.href="" window.location=""

我会带着你远行/ 2021年12月18日 05:57/ 0 赞/ 493 阅读

相关 webApp调试页面的几种方式

前言 PC端web页面调试比较容易，这里主要说几种移动端调试的方法，从简单到复杂、从模拟调试到远程调试，大概分为几部分： 1、Chrome DevTools（谷歌浏览器

旧城等待，/ 2021年09月30日 00:06/ 0 赞/ 478 阅读

相关 js页面跳转常用的几种方式

<script language="javascript" type="text/javascript"> window.location.href=

拼搏现实的明天。/ 2021年09月16日 05:58/ 0 赞/ 487 阅读