• HTML基础之JS


    JS一种脚本语言,它的解释器被称为JavaScript引擎,为浏览器的一部分,广泛用于客户端的脚本语言,最早是在HTML网页上使用,用来给HTML网页增加动态功能。

    HTML 中的脚本必须位于 <script> 与 </script> 标签之间。脚本可被放置在 HTML 页面的 <body> 和 <head> 部分中。

    <script>
    alert("My First JavaScript");
    </script>

    引入JavaScript代码类似于Python的import

    <script src="复习.js" type="text/javascript"></script>

    head中引入JS与body中引入JS的区别

    写在head里面:代码从上到下依次执行,加载css,然后加载js,因为body还没开始加载,所以展现给用户的是一个白板页面,影响页面得加载速度
    通常放在htmlbody里面的最下方,先加载css再加载html页面,最后加载js。注:必须是写在body里面的。

    JS定义字符串

    定义字符串
    var name = '你开心就好!'
    var str = '双鱼座'
    字符串的拼接
    var name_str = name+str
    字符串操作
    name.charAt(0) 根据角标获取字符串中的某一个字符 char字符
    name.substring(0,2)根据角标获取字符串子序列,顾头不顾尾
    name.length获取字符串长度
    name.concat('毛毛')拼接字符串
    name.indexOf('开')获取子序列的位置
    name.slice(0,2)//切片,顾头不顾尾,与substring一样
    var str = 'eeeEE'
    str.toLowerCase() 变更为小写
    str.toUpperCase() 变更为大写
    name.split('心') 以“心”分割

    数字类型
    var num = 88.88
    var strNum = '88.88'
    parseInt(strNum)//返回一个整数
    parseFloat(strNum)//返回一个浮点数
    布尔类型(true 或 false)
    var t = true; var f = false; 全部小写

    数组类型(与python列表类似)

    第一种创建方式:
    var list1 = new Array()
    list1[0] = 1
    list1[2] = 2
    第二种创建方式:
    var list2 = new Array('','')
    第三种创建方式:
    var list3 = ['','','']
    list3.length 数组的长度
    list3.push('aaa') 尾部追加参数
    list3.shift() 头部获取一个元素 并删除该元素
    list3.pop()  尾部获取一个元素 并删除该元素
    list3.unshift('dsx')  头部插入一个元素
    list3.splice(start,deleteCount,value)  插入、删除或替换数组的元素
    list3.splice(1,0,'aa')  指定位置插入元素
    list3.splice(1,1,'aa')  指定位置替换元素
    list3.splice(1,1)  指定位置删除元素
    list3.slice(0,2)  切片,顾头不顾尾
    list3.reverse  反转
    list.join('-')  将数组根据分隔符拼接成字符串
    list.concat([1,2])  数组与数组拼接
    list.sort()  排序

    对象类型(等同于python的字典)

    var dict = {name:'dsx',age:18,sex:'' };
    var age = dict['age']  赋值
    var name = dict.name  赋值
    delete dict['name']  删除
    delete dict.age  删除

    JS条件判断语句

    if(1==2){
            console.log(111111111)
        }else if(2==2){
            console.log(22222222)
        }else{
            console.log('最后了!')
        }
    ==============================================================
        if('1'===1){ //三个等号校验数据类型,两个等号则不判断数据类型
            console.log(1111111)
        }else{
            console.log(222222)
        }
    
    ==============================================================
          switch (2){
              case 1:
                  console.log(11111);
                  break;
              case 2:
                  console.log(22222);
                  break;
              default:
                  console.log(33333333)
          }

    JS循环语句

      //循环字符串
          var name = 'dsx nhy';
          for(var a in name){
              console.log(name[a]);
          }
          //循环数组
          var car = ['宝马', '奔驰', '尼桑'];
          for (var i in car){
              console.log(car[i])
          }
        //循环字典,不支持字典k,v一起循环
          var dict = {'宝马': 'BMW', '奔驰': 'BC'};
          for(var d in dict){
            console.log(dict[d])
          }
        //只能循环列表和字符串,不支持字典循环
    for(var i=0;i<=car.length;i++){
    console.log(i)
    }

          //死循环,与python相同
    while(1==1){
    console.log(11111111)
    }
    
    

     JS中函数的使用

     1.普通函数
     function f(name,age){
            console.log(name);
            console.log(age)
        }
        f('dsx',18)

    栗子:

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
    </head>
    <body>
    <div><input type="button" value="点我" onclick="demo()"> </div>
    <div><input type="text" name="username" > </div>
      <script> 
    function demo() {
    alter(
    '点我时弹出的!');
    }
    </script>
    </body>
    </html>
    2.匿名函数
    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <title>Title</title>
    </head>
    <body>
    <div><input id="i2" type="button" value="一键输入用户名" > </div>
    <div><input type="text" name="username" > </div>
    <script>
    //匿名绑定函数
    var demo = document.getElementById('i1')
    demo.onclick = function(){
    demo.parentElement.nextElementSibling.firstElementChild.value='JS_test';
    };
    </script>
    </body>
    </html>
     
    3.自执行函数
            (function () {
                console.log('自执行函数!')
            })()

    面向对象

       function f(name) {
            this.name = name;//this代指本类
            this.say = function () {
                console.log('say--->'+this.name);
            }
        }
        var obj = new f('dsx');
        obj.say();
        console.log(obj.name);
  • 相关阅读:
    获得二进制有多少个1
    读取txt数据
    int最大值
    oracle——数据表的相关操作——约束——各种约束详解
    oracle——数据表的相关操作——转移表空间
    oracle——数据表的相关操作——删除数据表
    oracle——数据表的数据查询——oracle高级函数
    oracle——数据表的相关操作——更新数据——update操作
    oracle——数据表的数据查询——oracle中的特殊表达式between and、in、like、is null、exists、all、some、any等
    oracle——数据表的数据查询——distinct 关键字、group by 字句、having子句
  • 原文地址:https://www.cnblogs.com/mululu/p/9259328.html
Copyright © 2020-2023  润新知