基础语法结构和数据类型

  1. <!DOCTYPE html>
  2. <html>
  3.     <head>
  4.         <meta charset="utf-8" />
  5.         <titile>JS</titile>
  6.     </head>
  7.     <body>
  8.         <script type="text/javascript">
  9.             alert(1+1);
  10.             console.log(1+1);
  11.             // 注释
  12.             /* 多行注释
  13.             var可 重复赋值
  14.             let不可重复赋值
  15.             const 常量
  16.             */
  17.             var a=1;
  18.             let b=1;
  19.             const c=3;
  21.             /* 
  22.             数值类型  int/float
  23.             字符串
  24.             数组 ==> go slice
  25.             字典（object） ==> go map
  26.             */
  27.             var height=1.68;
  28.             const gender= 'gale'
  29.             let age=31;
  30.             let isMale=false; 
  31.             var nullVal=null; //nil
  32.             console.log(typeof(name),typeof(gender),typeof(age),typeof(height),typeof(isMale));
  34.             //运算
  35.             //四则运算 +-*/ %
  36.             //位运算 & | ^ ~ << >>
  37.             //赋值运算 =,+=,-=,*=,/=,%=
  38.             //布尔运算  && || !
  39.             //关系运算 > < >= <= != == ===
  41.             //数值运算： 
  42.             //字符串 只能使用 + 运算符
  45.             //数组,js是弱类型语言 
  46.             var name = ["kk","小凡","xq",1];
  47.             console.log(typeof(names),names);
  49.             //数组四种操作方式 shift，unshift,push ,pop;
  50.             /*
  51.             shift 往后移动一位
  52.             unshift(value) 在前面添加value
  53.             push(value) 在后面添加value
  54.             pop向前面移动一位
  55.             */
  56.             var names=[]
  57.             names.push(1)
  58.             names.push(2)
  59.             names.push(3)
  61.             console.log(names)
  63.             names.shift()
  65.             console.log(names)
  67.             names.unshift(2)
  69.             console.log(names)
  70.             names.pop()
  72.             console.log(names)
  74.             //连接数组
  75.             names.concat(name)
  77.             if(true){
  78.                 console.log(names);
  79.             } else if (1==1){
  80.                 console.log(names);
  81.             } else {
  82.                 console.log();
  83.             }
  85.             A=1;
  86.             switch (A) {
  87.                 case 0:console.log("0");break; //没有break会继续往下执行，与go不同点
  88.                 case 1:console.log("1");break;
  89.                 case 2:console.log("2");break;
  90.                 default:console.log("default");
  91.             }
  93.             // 字典
  94.             var user={a:1,b:2}
  95.             console.log(user)
  97.             //函数
  98.             function add(a,b){
  99.                 return a+b;  //弱类型语言，不需要设置返回值类型
  100.             }
  102.             var rt =add(1,2);
  103.             console.log(rt);
  105.             //循环
  106.             for(var key in user){
  107.                 console.log(key,user[key]);
  108.                 if(true){
  109.                     continue;
  110.                     // or
  111.                     break;
  112.                 }
  113.             }
  115.             do{
  116.                 console.log(i);
  117.                 i++;
  118.             } while(i<10);
  119.         </script>
  120.     </body>
  121. </html>

dom文档

js是用来修改dom文档的，修改他的内容、样式、属性等等等

  1. <!DOCTYPE html>
  2. <html>
  3.     <head>
  4.         <meta charset="utf-8" />
  5.         <titile>DOM</titile>
  6.     </head>
  7.     <body>
  8.         <div id="mydiv"></div>
  9.         <script type="text/javascript">
  10.             var div=document.getElementById("mydiv"); 
  11.             div.innerHTML=new Date(); //修改div的内容
  12.             console.log(div);
  13.             setTimeout(function(){  //延时执行，只执行一次
  14.                 console.log("timeout",new Date());
  15.             },10*1000);
  17.             setInterval(function(){
  18.                 console.log("interval",new Date());
  19.                 div.innerHTML= new Date();
  20.             },5*1000); //每间隔5秒执行一次
  21.             confirm("确认删除吗？")
  22.         </script>
  23.     </body>
  24. </html>

js也遵循先加载，再使用的原则，如下使用jquery库(先从jquery.com下载库)

文档更新时间: 2023-11-30 16:20   作者：张尚