求和-单双数-秒转时间-switch-?:-json

2013.10.11 2836 人浏览 留言

求和及判断数字

  1. <!DOCTYPE HTML>  
  2. <html>  
  3. <head>  
  4. <meta charset="utf-8">  
  5. <title>求和及判断数字</title>  
  6. <script>  
  7. window.onload=function()  
  8. {  
  9.     var oTxt1=document.getElementById('txt1');  
  10.     var oTxt2=document.getElementById('txt2');  
  11.     var oBtn=document.getElementById('btn1');  
  12.   
  13.     oBtn.onclick=function()  
  14.     {  
  15.         //alert(parseInt(oTxt1.value)+parseInt(oTxt2.value)); 最简单写法  
  16.   
  17.         //赋值  
  18.         var n1=parseInt(oTxt1.value);  
  19.         var n2=parseInt(oTxt2.value);  
  20.   
  21.         //alert(n1+n2); 不加判断直接求和  
  22.   
  23.         if(isNaN(n1))  
  24.         {  
  25.             alert('您输入的第一个数字有误');  
  26.         }  
  27.         else if(isNaN(n2))  
  28.         {  
  29.             alert('您输入的第二个数字有误');  
  30.         }  
  31.         else  
  32.         {  
  33.             alert(n1+n2);  
  34.         }  
  35.     }  
  36. }  
  37. </script>  
  38. </head>  
  39.   
  40. <body>  
  41. <input type="text" id="txt1">  
  42. <input type="text" id="txt2">  
  43. <input type="button" value="求和" id="btn1">  
  44. </body>  
  45. </html>  

单双数 秒转时间

  1. <!DOCTYPE HTML>  
  2. <html>  
  3. <head>  
  4. <meta charset="utf-8">  
  5. <title>单双数 秒转时间</title>  
  6. <style>  
  7.     .odd{background: #ccc;}  
  8. </style>  
  9. <script>  
  10. window.onload=function()  
  11. {  
  12.     //单双数  
  13.     var aLi=document.getElementsByTagName('li');  
  14.     for(var i=0;i<aLi.length;i++)  
  15.     {  
  16.         if(i%2==0)  
  17.         {  
  18.             aLi[i].className='odd'  
  19.         }  
  20.         else  
  21.         {  
  22.             aLi[i].className='even'  
  23.         }  
  24.     }  
  25.   
  26.     //秒转时间  
  27.     var oTxt=document.getElementById('txt');  
  28.     var oBtn=document.getElementById('btn');  
  29.     var oDiv=document.getElementById('div');  
  30.   
  31.     oBtn.onclick=function()  
  32.     {  
  33.         var n=parseInt(oTxt.value);//这个要放在oBtn.onclick里面  
  34.         if(isNaN(oTxt.value))  
  35.         {  
  36.             alert('您输入的数字有误')  
  37.         }  
  38.         else  
  39.         {             
  40.             oDiv.innerHTML=parseInt(n/60)+'分'+parseInt(n%60)+'秒';//注意 这里不能直接除以360来计算小时  
  41.         }  
  42.     }  
  43. };  
  44. </script>  
  45. </head>  
  46.   
  47. <body>  
  48. <li></li>  
  49. <li></li>  
  50. <li></li>  
  51. <li></li>  
  52. <li></li>  
  53. <li></li>  
  54. <li></li>  
  55. <li></li>  
  56. <li></li>  
  57. <li></li>  
  58. <br>  
  59. <input type="text" id="txt">  
  60. <input type="button" id="btn" value="秒转时间">  
  61. <div id="div"></div>  
  62. </body>  
  63. </html>  

switch应用

  1. <!DOCTYPE HTML>  
  2. <html>  
  3. <head>  
  4. <meta charset="utf-8">  
  5. <title>switch</title>  
  6. <style>  
  7.   
  8. </style>  
  9. <script>  
  10. var name='abc';  
  11. var sex='男';  
  12. switch(sex)  
  13. {  
  14.     case '男'://这里是冒号，不是分号  
  15.         alert(name+'先生您好');  
  16.         break;  
  17.     case '女':  
  18.         alert(name+'女士您好');  
  19.         break;  
  20.     default:  
  21.         alert(name+'您好');  
  22. }  
  23. </script>  
  24. </head>  
  25.   
  26. <body>  
  27.   
  28. </body>  
  29. </html>  

三木?:

  1. <!DOCTYPE HTML>  
  2. <html>  
  3. <head>  
  4. <meta charset="utf-8">  
  5. <title>?:</title>  
  6. <style>  
  7.   
  8. </style>  
  9. <script>  
  10. window.onload=function()  
  11. {  
  12.     var oTxt=document.getElementById('txt');  
  13.     var oBtn=document.getElementById('btn');  
  14.     var oDiv=document.getElementById('div');  
  15.     var n=parseInt(oTxt.value);  
  16.     oBtn.onclick=function()  
  17.     {  
  18.         /*  
  19.         if(n%2==0)  
  20.         {  
  21.             oDiv.innerHTML='双数'//这里是用=不是用括号  
  22.         }  
  23.         else  
  24.         {  
  25.             oDiv.innerHTML='单数'  
  26.         }  
  27.         */  
  28.   
  29.         n%2==0?oDiv.innerHTML='双数':oDiv.innerHTML='单数';//注意用的是:  
  30.   
  31.     }  
  32. }  
  33.   
  34.   
  35. </script>  
  36. </head>  
  37.   
  38. <body>  
  39.     <input type="text" id="txt">  
  40.     <input type="button" id="btn" value="判断单双数">  
  41.     <div id="div"></div>  
  42. </body>  
  43. </html>  

判断真假
真：true、非零数字、非空字符串、非空对象
假：flase、数字零、空字符串、空对象、undefined

json和arr

  1. <!DOCTYPE HTML>  
  2. <html>  
  3. <head>  
  4. <meta charset="utf-8">  
  5. <title>json与arr</title>  
  6. json下标是字符串，没有length  
  7. arr下标是数字  
  8.   
  9. 循环  
  10. 数组 for 0-length  
  11. kson for in  
  12. <script>  
  13.   
  14. var json={a:12,b:5,c:7};  
  15. //这里前面还有一个等号，用的是大括号，中间用的是逗号  
  16.   
  17. /*  
  18. //alert (json.a);  
  19. alert (json['a']);  
  20. */  
  21.   
  22. for (var i in json)  
  23. {  
  24.     alert('json的第'+i+'个数值是'+json[i])  
  25. }  
  26.   
  27.   
  28. var arr=[12,5,7];  
  29.   
  30. /*  
  31. alert(arr[0])  
  32. */  
  33.   
  34. //循环  
  35.   
  36. /*  
  37. for(var i=0;i<arr.length;i++)  
  38. {  
  39.     alert('第'+i+'个数值是'+arr[i])  
  40. }  
  41. */  
  42.   
  43. for (var i in arr)  
  44. {  
  45.     alert('arr的第'+i+'个数值是'+arr[i])  
  46. }  
  47.   
  48.   
  49. </script>  
  50. </head>  
  51.   
  52. <body>  
  53.   
  54. </body>  
  55. </html>  

<olstart="1">

    1. JavaScript基础
    2. JavaScript基础

    a)JavaScript组成

    1. i.ECMAScript：解释器、翻译
    2. ii.DOM：DocumentObjectModel
    3. iii.BOM：BrowserObjectModel
      1. 各组成部分的兼容性，兼容性问题由来
    4. 变量类型(1)

    a)类型：typeof运算符

    1. i.用法、返回值
    2. ii.常见类型：
      1. number、string、boolean、undefined、object、function

    b)一个变量应该只存放一种类型的数据

    1. 变量类型(2)

    a)数据类型转换

    1. i.例子：计算两个文本框的和
    2. ii.显式类型转换(强制类型转换)
      1. parseInt()、parseFloat()
      2. NaN的意义和检测
      3. iii.隐式类型转换
        1. ==、===
        2. 减法
    3. 变量作用域和闭包

    a)变量作用域（作用范围）

    1. i.局部变量、全局变量

    b)什么是闭包

    1. i.子函数可以使用父函数中的局部变量
    2. ii.之前一直在使用闭包
    3. iii.网上对于闭包的定义
    4. 命名规范(1)

    a)命名规范及必要性

    1. i.可读性——能看懂
    2. ii.规范性——符合规则

    b)匈牙利命名法

    1. i.类型前缀
    2. ii.首字母大写
    3. 命名规范(2)
    4. 运算符

    a)算术：+加、-减、*乘、/除、%取模

    1. i.实例：隔行变色、秒转时间
      1. 赋值：=、+=、-=、*=、/=、%=
      2. 关系：<、>、<=、>=、==、===、!=、!==
      3. 逻辑：&&与、||或、!否
    1. i.实例：全选与反选

    e)运算符优先级：括号

    1. 程序流程控制
      1. 判断：if、switch、?:
      2. 循环：while、for
      3. 跳出：break、continue

    d)什么是真、什么是假：

    1. i.真：true、非零数字、非空字符串、非空对象
    2. ii.假：false、数字零、空字符串、空对象、undefined
    3. Json
      1. 什么是Json
      2. Json和数组
      3. Json和forin

文章地址：https://huilang.me/isay/summation-and-judgment-figures/

回复本文

您的电子邮箱地址不会被公开。 必填项已用 * 标注

icon_wink.gif icon_neutral.gif icon_mad.gif icon_twisted.gif icon_smile.gif icon_eek.gif icon_sad.gif icon_rolleyes.gif icon_razz.gif icon_redface.gif icon_surprised.gif icon_mrgreen.gif icon_lol.gif icon_idea.gif icon_biggrin.gif icon_evil.gif icon_cry.gif icon_cool.gif icon_arrow.gif icon_confused.gif icon_question.gif icon_exclaim.gif