javascript 中的console.log和弹出窗口alert


Posted in Javascript onAugust 30, 2016

主要是方便你调式javascript用的。你可以看到你在页面中输出的内容。

相比alert他的优点是:

1.他能看到结构话的东西,如果是alert,淡出一个对象就是[object object],但是console能看到对象的内容。

2.console不会打断你页面的操作,如果用alert弹出来内容,那么页面就死了,但是console输出内容后你页面还可以正常操作。

3.onsole里面的内容非常丰富,你可以在控制台输入:console,然后就可看到:

Console {memory: MemoryInfo, debug: function, error: function, info: function, log: function…}

简单的代码如下:

<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8">
<script type="text/javascript">
var a=3;
var b='这是什么';
var $c='啊!';
console.log(a,b,$c);
var $='jqery';
alert($);
</script>
</head>
<body>
</body>
</html>

上面的代码浏览器中会弹出窗口,显示jquery字样。

javascript 中的console.log具体用法

//变量
var i = 'I am a string';
console.log('变量:',i);
//数组
var arr = [1,2,3,4,5];
console.log('数组:',arr);
//对象
var obj1 = {
key1 : 'value1',
key2 : 'value2',
key3 : 'value3'
};
var obj2 = {
key6 : 'value4',
key5 : 'value5',
key4 : 'value6'
};
var obj3 = {
key9 : 'value7',
key8 : 'value8',
key7 : 'value9'
};
console.log('对象:',obj1);
//对象数组
var objArr1 = [obj1,obj2,obj3];
var objArr2 = [[obj1],[obj2],[obj3]];
console.log('对象数组1:',objArr1);
console.log('对象数组1:',objArr2);
/*
输出:
变量:I am a string
数组:[1, 2, 3, 4, 5]
对象:Object { key1="value1", key2="value2", key3="value3"}
对 象数组1:[Object { key1="value1", key2="value2", key3="value3"}, Object { key6="value4", key5="value5", key4="value6"}, Object { key9="value7", key8="value8", key7="value9"}]
对象数组1:[[Object { key1="value1", key2="value2", key3="value3"}], [Object { key6="value4", key5="value5", key4="value6"}], [Object { key9="value7", key8="value8", key7="value9"}]]
*/

以上所述是小编给大家介绍的javascript 中的console.log和弹出窗口alert,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
传递参数的标准方法(jQuery.ajax)
Nov 19 Javascript
JavaScript 学习小结(适合新手参考)
Jul 30 Javascript
jquery $.ajax各个事件执行顺序
Oct 15 Javascript
Jquery中getJSON在asp.net中的使用说明
Mar 10 Javascript
JS保存、读取、换行、转Json报错处理方法
Jun 14 Javascript
jquery表单验证框架提供的身份证验证方法(示例代码)
Dec 27 Javascript
jQuery 3.0十大新特性最终版发布
Jul 14 Javascript
Vuejs第十一篇组件之slot内容分发实例详解
Sep 09 Javascript
Vue页面骨架屏注入方法
May 13 Javascript
解决vue热替换失效的根本原因
Sep 19 Javascript
JavaScript数组排序小程序实现解析
Jan 13 Javascript
Vue 电商后台管理项目阶段性总结(推荐)
Aug 22 Javascript
Laravel中常见的错误与解决方法小结
Aug 30 #Javascript
js中常用的Tab切换效果(推荐)
Aug 30 #Javascript
基于cssSlidy.js插件实现响应式手机图片轮播效果
Aug 30 #Javascript
JavaScript探测CSS动画是否已经完成的方法
Aug 30 #Javascript
基于JavaScript实现鼠标箭头移动图片跟着移动
Aug 30 #Javascript
很棒的js Tab选项卡切换效果
Aug 30 #Javascript
js改变透明度实现轮播图的算法
Aug 24 #Javascript
You might like
基于Laravel5.4实现多字段登录功能方法示例
2017/08/11 PHP
PHP基于session.upload_progress 实现文件上传进度显示功能详解
2019/08/09 PHP
Laravel 微信小程序后端搭建步骤详解
2019/11/26 PHP
PHP基于进程控制函数实现多线程
2020/12/09 PHP
Nigma vs AM BO3 第二场2.13
2021/03/10 DOTA
JQuery UI的拖拽功能实现方法小结
2012/03/14 Javascript
网页源代码保护(禁止右键、复制、另存为、查看源文件)
2012/05/23 Javascript
Jquery写一个鼠标拖动效果实现原理与代码
2012/12/24 Javascript
你必须知道的Javascript知识点之&quot;字面量和对应类型&quot;说明介绍
2013/04/23 Javascript
输入自动提示搜索提示功能的javascript:sugggestion.js
2013/09/02 Javascript
jquery禁用右键示例
2014/04/28 Javascript
JavaScript获取Url里的参数
2014/12/18 Javascript
JavaScript中this详解
2015/09/01 Javascript
jQuery form插件的使用之处理server返回的JSON, XML,HTML数据
2016/01/26 Javascript
jquery遍历json对象集合详解
2016/05/18 Javascript
Bootstrap导航条可点击和鼠标悬停显示下拉菜单的实现代码
2016/06/23 Javascript
基于vue.js实现图片轮播效果
2016/12/01 Javascript
JavaScript分步实现一个出生日期的正则表达式
2018/03/22 Javascript
echarts设置图例颜色和地图底色的方法实例
2018/08/01 Javascript
详解多页应用 Webpack4 配置优化与踩坑记录
2018/10/16 Javascript
分享Angular http interceptors 拦截器使用(推荐)
2019/11/10 Javascript
[00:42]《辉夜杯》—职业组预选赛12月3日15点 正式打响
2015/12/03 DOTA
利用python将图片转换成excel文档格式
2017/12/30 Python
Python使用base64模块进行二进制数据编码详解
2018/01/11 Python
python按照多个条件排序的方法
2019/02/08 Python
django 连接数据库 sqlite的例子
2019/08/14 Python
Django获取应用下的所有models的例子
2019/08/30 Python
利用 Flask 动态展示 Pyecharts 图表数据方法小结
2019/09/04 Python
利用Python制作动态排名图的实现代码
2020/04/09 Python
时尚的CSS3进度条效果
2012/02/22 HTML / CSS
CSS3实现10种Loading效果
2016/07/11 HTML / CSS
Paradigit比利时电脑卖场:购买笔记本、电脑、平板和外围设备
2016/11/28 全球购物
连锁经营管理专业大学生求职信
2013/10/30 职场文书
科技开发中心办公室主任岗位责任制
2014/02/10 职场文书
意外伤害赔偿协议书范文
2014/09/23 职场文书
惊天动地观后感
2015/06/10 职场文书