zoukankan      html  css  js  c++  java
  • html04

    web的三要素:
    HTML:搭建页面的基本结构
    css: 对页面进行修饰-让页面更美观
    JavaScript:让页面可以有交互行为(用户和界面)
    1.js是什么:
    JavaScript :页面的脚本语言,运行在页面上
    不是Java的脚本语言
    是一门客户端的脚本语言,不进行编译,直接解释运行
    1)符合ECMAscript规范 es6
    2)DOM (Document Object Model 文档对象模型)
    3)BOM (Borwser Object Model )

    2.js的特点
    -解释执行 逐行执行
    -基于对象 js内部提供了大量的内置对象,通用对象和常用方法
    -适合做:
    -客户端的数据计算
    -客户端的表单验证(比如邮箱是否合法)
    -浏览器的事件触发(和浏览器相关的操作只能由js去做)
    -网页的特殊效果(只能js去做)
    -服务器的异步交互(同步,所有操作都关联,异步,步不关联,步影响)

    3.基本使用
    1)行内式
    如:直接在页面节点添加onclick="alert('11111')";
    2)嵌入式(内部式)
    如:1.页面节点添加onclick="f1()"
    2.使用script标签
    在标签里定义function f1(){}
    3)外部式(文件调用式)
    如:1.页面节点添加onclick="f1()"
    2.使用script标签,引入js文件
    3.在js文件中定义f1函数

    4.js基本语法
    * 由字符集Unicode字符集进行编码
    * js的注释 //单行 /*多行*/
    * 语句 表达式 运算符 (大小写敏感)
    * 标识符 数字,字母,下划线,$,数字不能开头
    基本组成部分(同Java)
    见名知意,不能使用关键字,数字不能开头
    驼峰命名法,从第二个单词字母开头大写
    * 变量
    -js是若类型语言 声明变量时使用关键字 var
    -变量所引用的数据,都是有类型的
    -没有初始化的变量,统一赋值为undefined
    ***js会根据不同的值,自动转换成对应的数据类型
    数据类型有哪些
    1.特殊类型
    null - null在程序中代表无值,或者无对象,空
    给变量赋值为null,来清空变量的内容
    undefined -表示未定义
    -声明1个变量,但是未初始化,变量的值为undefined
    -对象的属性不存在
    2.内置对象(只讲其中几个基本类型)
    1)string 单双引号都可以 "" 或 ''
    特殊字符需要转义
    常用方法:indexOf() -返回指定字符在字符串中首次出现的下标
    replace(a,b);
    将指定字符a,替换为字符b,替换第一个
    2)number 数值类型
    js中不区分整数,浮点数
    3)boolean
    布尔类型 (boolean类型能自动转成number类型参与计算 ,true=1,false=0)
    3.类型转换
    1)自动转换
    number + string = string
    number + boolean=number
    string + boolean=string
    boolean+boolean=number
    2)强制转换(函数来实现)
    toString() 所有的数据类型都可以转成string
    parseInt() 强转成整数
    -如果不能强转,出来的是NaN
    -如果是小数,会转成取整,小数点后的全部丢弃
    parseFloat() 不能转NaN
    isNaN() 表示是否是数值
    -true:表示非数值
    -false:表示数值
    -------------------------------------------------------
    栗子:
    var age=34;
    console.log(age);
    结果为: 34

    var name="zhangsan";
    console.log(name);
    结果为: zhangsan

    var sex;
    console.log(sex);
    结果为: undefined

    console.log(typeof age);
    结果为: number

    console.log(typeof name);
    结果为: string

    console.log(typeof sex);
    结果为: undefined
    -----------------------------------------------------

    练习:验证用户输入的内容是否是数值
    如果是 进行求平方运算
    如果不是 提示输出数值

    var ele=document.getElementById("txt_number");
    console.log(ele);//以日志的形式打印具体对象的所有内容
    alert(ele); //以alert的形式打印具体对象的所属类型
    //获取输入框节点的值
    var v=ele.value;
    console.log(v);
    ---------------------------------------------------------------
    *运算
    算术: + - * / (只有除法和Java不同)
    /:Java中 7/3=3
    js中 7/2=3.5
    逻辑运算: !(非) &(与) |(或) && || >= <= !=

    js中 == 只比较值,不比较类型 (比如 1=="1" 结果true)
    === 全等于,比较值,同时也比较类型 (比如 1===1,"1"==="1" 结果true 1===true 结果false)
    ++ --
    a++ 先将a的值进行运算,再赋值
    ++a 先将a赋值,在进行运算

    条件?成立的操作:不成立的操作; (三目运算符)

    练习:猜数字 ,内置1个数值(比如20)
    比较用户输入的数字和内置数值是否相等,提示大了,小了,对了

    <input id="txt_gress" onblur="allert(111)"> onblur:失去焦点
    <input id="txt_gress" onblur="gress2(this.value)"> this :当前对象的使用

    *流程控制语句
    if...else...
    if(表达式){
    执行语句;
    }else if(表达式){
    执行语句;
    }...else{

    }
    注意:Java中条件表达式必须返回boolean
    js中可以是任何表达式
    表达式的值 对应的boolean
    true true
    false false
    "非空" true
    "" flase
    0 false
    null false
    undefined false
    NaN false
    ****只有true和非空字符串是true****
    这句话任何流程控制语句中都适用,包括for循环
    -switch...case
    switch(变量){
    case 值:执行语句;break;
    case 值:执行语句;break;
    case 值:执行语句;break;
    ...
    default :执行语句;break;
    }
    -for
    for(var i=0;i<10;i++){
    执行语句;
    }
    -while(表达式){
    执行语句;
    }
    -do{执行语句;}while(表达式);
    do...while()至少执行1次
    while执行0-n次

    练习:求1-10的阶乘
    调错:1)检查浏览器缓存到底js代码
    2)看报错信息
    3)用断点debugger调试
    4)在js代码中加alert或者console.log;

    2)百元买百鸡
    母鸡 5块 1只
    公鸡 3块 1只
    小鸡 1块 3只
    问:100元买100只整鸡,一共有几种情况
    思路:母鸡:0-20只;
    公鸡:0-33只;
    var count=0;
    for(var i=0;i<=20;i++){//买母鸡
    for(var j=0;j<=33;j++){//买公鸡
    var z=100-i-j;//买小鸡
    //小鸡的只数是3的整数倍&&总价格==100
    if(z%3==0&&(5*i+j*3+z/3)==100){
    count++;
    }

    }
    }


    查看用户输入内容(字符串)中出现的指定字符的个数

  • 相关阅读:
    SAP的PI日志查看工具
    微信小程序调用SAP发布的REST显示数据列表
    SAP发布REST/HTTP接口
    SAP的JSON没有双引号问题
    SAP扩展库位
    函数使用十一:BAPI_BANK_CREATE
    竟然有人在群里谈交钱培训PI。。。。等哥哥有时间,断了你们的财路
    FPM十一:点击POPUP显示明细
    WDA基础十八:Select option配置
    SAP常见查询组合
  • 原文地址:https://www.cnblogs.com/yingyigongzi/p/9232266.html
Copyright © 2011-2022 走看看