• JavaScript学习Day001

    JavaScript 是脚本语言

    JavaScript 是一种轻量级的编程语言。

    JavaScript 是可插入 HTML 页面的编程代码。

    JavaScript 插入 HTML 页面后，可由所有的现代浏览器执行。

    js的位置

    标签中

    1. html>
    2. <html lang="en">
    3. <head>
    4.     <meta charset="UTF-8">
    5.     <meta http-equiv="X-UA-Compatible" content="IE=edge">
    6.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
    7.     <title>Documenttitle>
    8. head>
    9. <body>
    10.     
    11.     <p onclick="alert('123')">点击p>
    12. body>
    13. html>

    内部

    1. <script>
    2.     var pEles = document.getElementsByTagName("p");
    3.     pEles[0].addEventListener("click",function(){
    4.         this.style.color="red";
    5.     })
    6. script>

    外部

    1. //等待页面加载完毕之后执行
    2. window.onload=function(){
    3. //获取p标签
    4. var pEle=document.querySelector('p');
    5. //给获取的p标签绑定点击
    6. pEle.onclick = function (e) {
    7.     this.style.fontSize = "40px";
    8.     this.style.color = "#f00";
    9. }
    10. }
    1. html>
    2. <html lang="en">
    3. <head>
    4.     <meta charset="UTF-8">
    5.     <meta http-equiv="X-UA-Compatible" content="IE=edge">
    6.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
    7.     <title>Documenttitle>
    8.     <script src="js/myJavaScript.js">script>
    9. head>
    10. <body>
    11.     <p>点击变大p>
    12. body>
    13. html>

    js变量

    js中所有的变量声明都是用var

    变量的声明

    先声明变量，再赋值

    1. var num1;
    2. var result;
    3.  
    4. num1=10;
    5. result='dasd'

    变量声明和赋值一起写

    var result2=true;
    console.log(result2)

    1. var result2=true;
    2. console.log(result2)

    不声明变量直接赋值,这种方式容易出现问题，轻易不要使用

    result3='hello java'
    console.log(result3)

    1. result3='hello java'
    2. console.log(result3)

    操作数据：通过操作变量来操作数据

        doucument.write():将内容输出再页面中
        console.log()将内容输出在控制台，用于调试

    js数据类型

    数据类型包含

        Primitive值类型(基本类型)

            字符串String
            数字Number
            布尔Boolean
            空Null
            未定义Undefined
            Symbol

        Object引用数据类型(对象类型)

            对象Object
            数组Array
            函数Function
            正则RegExp
            日期

    通过typeof查询数据类型

    运算符

    赋值运算符

        =

    算数运算符

        +、-、*、/、%、++、--、+=、-=、*=、/=、%=

    关系运算符

        >、<、==、===、<=、>=、!=关系运算符的返回值是布尔类型

    ==与===(恒等于)的区别

    ==比较内容，不比较数据类型
    ===不仅比较内容还比较数据类型

    逻辑运算符

        &、&&、|、||

    &&和&的区别

    &是先把两边的转换成0或者1，在进行比较，最后输出出来的是0或者1
    &&两边的值为true或false，最后输出出来的也是true或者false

    ||和|的区别

    |是先把两边的值转换成0或者1，再进行比较，最后输出出来的是0或者1
    ||两边的值为true或者false，最后输出出来的是true或者false

    1. console.log(true|false)
    2. console.log(true||false)

    关系运算符

    条件？表达式1：表达式2

    键盘输入数据

    prompt()

        从页面输出中输入的数据，类型是String类型，如果不输入数据，最后的到的内容是空，类型也是String类型，如果直接点击取消最后得到的类型是Object

        弹出输入框
            var age=prompt();
        弹出输入框，输入框带提示
            var age = prompt("请输入您的年龄：");
        弹出输入框，输入框带提示、默认值
            var age = prompt("请输入您的年龄：",12)

    选择结构

    if选择结构

    单分支if选择结构

    1. var jsScore=90
    2. if(jsScore>80){
    3. console.log("奖励100元")
    4. }

    双分支if选择结构

    1. var jsScore=9;
    2. if(jsScore>80){
    3. console.log("奖励100元");
    4. }else{
    5.  console.log("无奖励")
    6. }

    多分支选择结构

    1.         var Score= prompt("请输入你的成绩");
    2.         if(Score>90){
    3.             console.log("优秀");
    4.         }else if(Score>80){
    5.             console.log("良好");
    6.         }else if(Score>60){
    7.             console.log("中等");
    8.         }else{
    9.             console.log("差")
    10.         }
    11.         console.log("程序执行完毕");

    嵌套if选择结构

    1.         var runScore=prompt("请输入您的百米赛跑成绩")
    2.         if(runScore<10){
    3.             console.log("恭喜您进入决赛")
    4.             var gender=prompt("请输入您的性别")
    5.             if(gender=="男"){
    6.                 console.log("进入男子决赛组");
    7.             }else if(gedner="女"){
    8.                 console.log("进入女子决赛组");
    9.             }else{
    10.                 console.log("性别输入有误")
    11.             }
    12.         }else{
    13.             console.log("很遗憾不能进入决赛")
    14.         } 

    switch选择结构

        switch选择结构
        switch选择结构的穿透现象

    1.  
    3.     <script>
    4.         var month = 11;
    5.         switch (month) {
    6.             case 12:
    7.             case 1:
    8.             case 2:
    9.                 console.log("冬季")
    10.                 break;
    11.             case 3:
    12.             case 4:
    13.             case 5:
    14.                 console.log("春季")
    15.                 break;
    16.             case 6:
    17.             case 7:
    18.             case 8:
    19.                 console.log("夏季")
    20.                 break;
    21.             case 9:
    22.             case 10:
    23.             case 11:
    24.                 console.log("秋季")
    25.                 break;
    26.         }
    27.     script>

    js中日期时间的获取

    js中的时间日期获取
        var date = new Date();
    console.log(date)
        获取年
            var year = date.getFullYear();
        获取月
            var month = date.getMonth()
    console.log(month+1)
        获取日
            当月的第几天
                console.log(date.getDate())
            这个星期的第几天
                console.log(date.getDay())

  • 相关阅读:
    【面试宝藏】Redis 常见面试题解析
    一看就懂：正则表达式
    Linux内存泄露案例分析和内存管理分享
    【登录安全测试】
    达芬奇机器人手术模拟系统RobotixMentQr
    阿里云难题学习笔记
    剖析虚幻渲染体系（14）- 延展篇：现代渲染引擎演变史Part 4（结果期）
    Web攻防06_sqlmap的使用
    无人驾驶智能改造机场“人货场”
    python案例：百钱买鸡
  • 原文地址：https://blog.csdn.net/qihaojinqiuma/article/details/126852940