1. JS的输出

innerHTML:

  1. <!DOCTYPE html>
  2. <html>
  3.  
  4. <head>
  5. <meta charset="utf-8">
  6. </head>
  7.  
  8. <body>
  9.  
  10. <h1>我的第一个 Web 页面</h1>
  11.  
  12. <p id="demo">我的第一个段落</p>
  13.  
  14. <script>
  15. document.getElementById("demo").innerHTML = "段落已修改。";
  16. </script>
  17.  
  18. </body>
  19. </html>

document.write()：

　　在页面载入之后，使用 document.write 后，输出的内容将覆盖原内容。

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. </head>
  6.  
  7. <body>
  8.  
  9. <h1>我的第一个 Web 页面</h1>
  10.  
  11. <p>我的第一个段落。</p>
  12.  
  13. <script>
  14. document.write(Date());
  15. </script>
  16.  
  17. </body>
  18. </html>

　　写到控制台的例子在前一篇已经用过了。

2. JS变量

　　用 内嵌JS的 html + Chrome F12 控制台的模式，调试JS语法。

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. </head>
  6.  
  7. <body>
  8.  
  9. <h1>我的第一个 Web 页面</h1>
  10.  
  11. <p>我的第一个段落。</p>
  12.  
  13. <script>
  14. c = 20;
  15. var d = 25;
  16. var myArray = [1, 2, 3, 4, 5];
  17. var myObject = {id:1, name:"Hello World"};
  18. function myPlus(a, b)
  19. {
  20.     return a + b;
  21. }
  22. console.log(myPlus(c,d));       //输出 45
  23. console.log(myArray[0]);        //输出 1
  24. console.log(myArray[1]);        //输出 2
  25. console.log(myObject.id);       //输出 1
  26. console.log(myObject.name);     //输出 Hello World
  27. </script>
  28.  
  29. </body>
  30. </html>

　　刚好最近在用 lua，上面这个例子可以看出：

  • 弱类型；
  • 变量声明时即赋值，var 可省略；
  • array 与 table 的构成方式与 lua 相同；
  • JS的数组索引从0开始，而不是lua从1开始；

3. JS流程控制：

break 用于跳出循环。
catch 语句块，在 try 语句块执行出错时执行 catch 语句块。
continue 跳过循环中的一个迭代。
do ... while 执行一个语句块，在条件语句为 true 时继续执行该语句块。
for 在条件语句为 true 时，可以将代码块执行指定的次数。
for ... in 用于遍历数组或者对象的属性（对数组或者对象的属性进行循环操作）。
function 定义一个函数
if ... else 用于基于不同的条件来执行不同的动作。
return 退出函数
switch 用于基于不同的条件来执行不同的动作。
throw 抛出（生成）错误 。
try 实现错误处理，与 catch 一同使用。
var 声明一个变量。
while 当条件语句为 true 时，执行语句块。

　　测试下 switch:

  1. function myCalculator(calc, a, b)
  2. {
  3.     switch(calc)
  4.     {
  5.         case "plus":
  6.             return a + b;
  7.         case "minus":
  8.             return a - b;
  9.         default:
  10.             return 0;
  11.     }
  12. }
  13. console.log(myCalculator("minus", 100,19));

　　可以看出在流程控制上 JS 的语法与 C/C++ 的写法几乎相同。

　　再来测试一下 for、for in。

  1. var myArray = [1, 2, 3, 4, 5];
  2. var myObject = {id:1, name:"Hello World"};
  3.  
  4. function looplog(paramArray, paramObject)
  5. {
  6.     for(k in paramArray)
  7.     {
  8.         console.log(k);        //输出 0-4，可见k是索引
  9.     }
  10.  
  11.     for(k in paramArray)
  12.     {
  13.         console.log(paramArray[k]);
  14.     }
  15.  
  16.     for(k in paramObject)
  17.     {
  18.         console.log(k);        //输出 id、name，k仍是索引
  19.     }
  20.  
  21.     for(k in paramObject)
  22.     {
  23.         console.log(paramObject[k]);
  24.     }
  25.  
  26.     for(var i = 0; i < paramArray.length; i++)
  27.     {
  28.         console.log(paramArray[i]);
  29.     }
  30. }
  31.  
  32. looplog(myArray, myObject);

JS 输出与变量的更多相关文章

  1. JavaScript 基础——使用js的三种方式，js中的变量，js中的输出语句，js中的运算符；js中的分支结构

    JavaScript 1.是什么:基于浏览器 基于(面向)对象 事件驱动 脚本语言 2.作用:表单验证,减轻服务器压力 添加野面动画效果 动态更改页面内容 Ajax网络请求 () 3.组成部分:ECM ...

  2. js中的变量类型

    js 中输出定义变量的类型  typeof  变量名. var u:  --underfined类型 var s = "你是一个好人":   --string类型 var n = ...

  3. js对象私有变量公有变量问题

    0 js对象私有变量公有变量问题5 小弟初学JS面向对象编程 现有一问题 请教各位大虾: Person=function (){ //私有变量定义 var name; vae age; var Ale ...

  4. js 函数和变量的提升

    js 函数和变量的提升 1. 函数的作用域: js中 ,函数的作用域为函数,而不是大括号. var hei = 123;if(true){ hei = 456;}console.log(hei);// ...

  5. JS函数和变量

    JS函数和变量  函数: 函数是由事件或者当它被调用时执行的可重复使用的代码块. 是一个独立的代码块,实现特定功能模块. 函数他不进行调用触发的话,不会自己主动执行. 像ATM机一样,不去取钱的话不会 ...

  6. Javascript开发技巧(JS中的变量、运算符、分支结构、循环结构)

    一.Js简介和入门 继续跟进JS开发的相关教程. <!-- [使用JS的三种方式] 1.HTML标签中内嵌JS(不提倡使用): 示例:<button onclick="javas ...

  7. 从零开始的JS生活（一）——JS简介、变量及基本结构

    本K在经过三个静态站制作的狂风暴雨之后,终于开始了JavaScript的学习.作为一只从来没有正儿八经接受过计算机语言的小白,居然能够跟上浩哥的课程进度,我的内心都被我的才智震惊到了,果然本K是天生丽 ...

  8. JS中的变量和输入输出

    一.使用JS的三种方式 1.在HTML标签中,直接内嵌JS(并不提倡使用) <button onclick="alert('点你咋地')">点我</button& ...

  9. 聊一聊JS输出为[object,object]是怎么回事

    JS输出为[object object] 今天在学习ES6中的 Symbol 数据类型时,在写demo时控制台输出为 Symbol[object object] ,当时有点疑惑,查阅了相关资料后搞清楚 ...

随机推荐

  1. B - Frogger

    题目大意: 一个叫做弗雷迪的青蛙坐在湖中间的一块石头上.突然他注意到他的青蛙女神菲奥娜坐在另一块石头上面,于是他计划去看她,但是呢湖里面的水很脏并且充满了游客的防晒霜,所以他想避免游泳而采用跳跃的方式 ...

  2. ganglia 启动命令

    gmond 版本号 3.1.7 sudo service ganglia-monitor start 验证是否打开 telnet localhost 8649 gmetad 版本号3.1.7 serv ...

  3. windows设置多长时间后自动关机 分类： windows常用小技巧 2014-04-15 09:35 230人阅读 评论(0) 收藏

    分二步: 第一步:点击windows键,在"搜索程序和文件"的文本框输入:cmd 第二步:输入:shutdown -s -t          (设置电脑一小时后自动关机) 备注: ...

  4. [连载]JavaScript讲义（03）--- JavaScript面向对象编程

  5. 统计学习导论：基于R应用——第二章习题

    目前在看统计学习导论:基于R应用,觉得这本书非常适合入门,打算把课后习题全部做一遍,记录在此博客中. 第二章习题 1. (a) 当样本量n非常大,预测变量数p很小时,这样容易欠拟合,所以一个光滑度更高 ...

  6. poj2239 Selecting Courses --- 二分图最大匹配

    匈牙利算法模板题 有n门课程,每门课程可能有不同一时候间,不同一时候间的课程等价. 问不冲突的情况下最多能选多少门课. 建立二分图,一边顶点表示不同课程,还有一边表示课程的时间(hash一下). #i ...

  7. 常用颜色大全---RGB值及中英文名称

    ■■■■■ #DC143C Crimson 深红/猩红 ■■■■■ #FFF0F5 LavenderBlush 淡紫红 ■■■■■ #DB7093 PaleVioletRed 弱紫罗兰红 ■■■■■ ...

  8. ld: 18 duplicate symbols for architecture i386 .linker command failed with exit code 1 (use -v to see invocation)_

    昨天被linker这个错误卡了一个小时!!!各种办法都试了 是导入第三方的问题 .. 网上说 要把所有的.m文件导入  但是我下载的微博SDK根本不关事..后来 大概知道是导入了多个相同的文件... ...

  9. IE6和IE7下绝对定位position：absolute和margin的冲突问题解决

    绝对定位的Position:absoulte的元素,会让相邻的兄弟元素的margin-top失效.而如果去掉了兄弟元素的高度又会正常. <div id="layer1" st ...

  10. php-fpm 启动参数及重要配置详解<转>

    原文地址  http://levi.cg.am/archives/3127 约定几个目录 /usr/local/php/sbin/php-fpm /usr/local/php/etc/php-fpm. ...