JS之常见的几种输出方式

第一种 alert
alert（）浏览器的提示框（只有一个确定按钮）。

在alert输出方式中，输出内容都是以字符串格式进行输出的，执行方式是，先将alert括号里面的内容转换成字符串格式的，然后再进行输出

alert(1+1);  // 输出的结果是字符串2
alert("珠峰培训");   // 在JS中用单引号和双引号包裹起来的都是字符串。
alert(1) // 提示的结果是字符串（它会把数字转化为字符串）。
alert(true) // 提示的结果是字符串true。
alert([1,2,3]) // 提示的结果是1,2,3，不再是数组了，它会把数组转换成字符串了。
alert({name:'小明',age:28}) // 提示的字符串[object Object]，不是之前的对象了，把字符串转换成对象了

第二种 confirm
confirm在alert的基础上增加了让用户选择性操作（提供两个按钮：确定和取消）
注意：输出格式也和alert一样也是字符串格式的。
var flag = confirm(‘确定要删除吗？’);
alert(flag);
以后可以根据接收的结果做不同的处理即可。

// 在alert基础上增加了确认和取消两个按钮，
// 用户可根据需要选择性操作->选择提示框，和alert一样提示的结果都是字符串格式的。
var flag = confirm('确定要删除吗？');
alert(flag);
// 当用户点击确定按钮的时候，得到的结果是布尔类型的true，点击取消或者点击关闭“x”,得到的布尔类型的false，此时我们可以根据接受的结果做不同的处理就知道用户进行什么样的操作了。

第三种 prompt
prompt在confirm基础上增加让用户输入的效果。
prompt用alert判断返回值，当点击取消或者"X"的时候，返回的null，不是字符串类型的。

// 在confirm 的基础上增加一个输入框，可以让用户输入一些文字
// 例如：删除的时候除了提示用户是否要删除，而且还想让用户输入删除的原因，这时候就可以使用prompt()。
var flag = prompt('确定要删除吗');
alert(flag);
// 当用户点击确定按钮的时候，我们可以获取到用户输入的内容，获取的内容是字符串格式的。（如果用户没输入内容获取到的结果是空字符串）；当用户点击取消或者“X”，得到的结果是null。

var zhufeng = prompt("are you happy?");
alert(zhufeng);
alert(typeof zhufeng);

如果在prompt的输出中输入的是null，返回的结果是字符串null，点击取消或者点击关闭的情况，我们得到的是对象Object。

其实我们在真实项目中，尤其在一些需要精美样式的的网站中，我们提示框一般都是自己封装插件和组件来实现的，不会用内置的（使用原生JS进行封装模态框组件。）

第四种控制台输出
控制台输出：方便开发人员进行调试的
快捷键：一般都是F12，也有的一些事Fn+F12。

优势：想要输出什么格式的数据都可以，不像上述三种方式一样，只能输出字符串。
console.log([content],[content]…)
console.dir相对于console.log来说输出的内容更加具体的详细
console.table 把JSON数据变为表格展示。

第五种： document.write
在文档中打印一些内容 //几乎已经被淘汰掉了。
输出的结果打印在浏览器的页面上。

JS之常见的几种输出方式相关推荐

js学习总结----js中常用的四种输出方式
1.alert('内容') 在浏览器中弹出框显示我们的内容不输入内容弹出undefined (注意alert弹出的都是字符串) 2.document.write('内容') 在页面中输出显 ...
探究JS常见的6种继承方式
先看以下百科对(面向对象的继承)的解释! 通过以上精炼实用的解释,我们可以了解到继承的基本作用和功能!即可以使得子类具有父类的属性和方法或者重新定义.追加属性和方法等. 广告:帮忙点击>> ...
JS 跨域问题常见的五种解决方式
JS 跨域问题常见的五种解决方式一.什么是跨域? 要理解跨域问题,就先理解好概念.跨域问题是由于javascript语言安全限制中的同源策略造成的. 简单来说,同源策略是指一段脚本只能读取来自同一来 ...
【JS继承】常见的7种继承方式
自我介绍:大家好,我是吉帅振的网络日志:微信公众号:吉帅振的网络日志:前端开发工程师,工作4年,去过上海.北京,经历创业公司,进过大厂,现在郑州敲代码. JS继承专栏 1[JS继承]什么是JS继承? ...
【温故知新】——原生js中常用的四种循环方式
一.引言本文主要是利用一个例子,讲一下原生js中常用的四种循环方式的使用与区别: 实现效果: 在网页中弹出框输入0 网页输出"欢迎下次光临" 在网页中弹出框输入1 网页输 ...
安川伺服总线通讯方式_plc通讯方式有哪三种?plc常见的三种通讯方式
原标题:plc通讯方式有哪三种?plc常见的三种通讯方式 PLC = Programmable Logic Controller,可编程逻辑控制器,一种数字运算操作的电子系统,专为在工业环境应用而设计 ...
js中数组的几种循环方式
js中数组的几种循环方式 for循环最基本的循环方式,不多说.这种最基本的循环才是速度最快的,效率最高的. for(var i = 0;i<5;i++){console.log(i) } for ...
锚链常见的几种连接方式
锚链常见的几种连接方式有档锚链由锚端链节.末端链接和若干中间链节组成,链节与链节之间用连接卸扣连接. 常用连接方式如下锚端链节 1.普环(Common Link,C)+......+普环(Comm ...
php 输出的区别,php的6种输出方式的区别_后端开发
程序中的注释部分是否参加编译?_后端开发程序中的注释部分是不参加编译的,也不会出现在目标程序中的,程序中的注释只是为了让程序员能更方便地读懂程序而提出来的,也就是说程序中的注释是给代码一个批注,让其 ...

JS之常见的几种输出方式

JS之常见的几种输出方式相关推荐

最新文章

热门文章