码迷,mamicode.com
首页 > Web开发 > 详细

HTML基础之JS

时间:2019-12-07 01:24:10      阅读:127      评论:0      收藏:0      [点我收藏+]

标签:bre   字符串   判断   demo   注释   修改   i++   confirm   input   

在HTML中可以将JavaScript/JS的代码写在head中,被script标签所包裹,当浏览器解释HTML时,遇到style标签时,按照CSS规则解释,遇到Script标签时,按照JavaScript的语法规则解释。

引入JavaScript代码,类似于Python的import

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

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

html代码从上而下解析,如果在head中引入JS,影响页面打开的速度,存在风险,所以通常放在htmlbody的最下方,这样页面内容先展示,最后在加载JS。注:写在最下面要有底线,写在body内部的最底下。

注释

单行注释通过 //  多行通过 /* */

JS变量

es5
name = ‘dsx‘; // 默认全局变量 
function func() {
    var name = ‘niulaoshi‘; // 局部变量 
}
 
es6
// let 定义的变量没有 预解析,let可以用来定义局部变量
alert(num1);
let num1 = 1;
alert(num1);

//    const 也没有变量预解析 const 定义常量,定义的程序不可以修改
const num2 = 2;
alert(num2);
num2 = 3

JS定义函数是用function,定义变量是用var

1、普通函数
function 函数名(形参, 形参, 形参) {
    执行代码块
}
函数名(形参, 形参, 形参);

function demo() {
//        console.log(‘aaaa‘) //相当于print()
//        alert(‘提示框!!!!‘) //提示框
        flag=confirm(‘确认要登陆吗??‘) //确认框
        console.log(flag)
    }
 
2、匿名函数 匿名函数没有名字,无法调用时找到,将整个函数当做一个参数传递
<input type="button"  value="匿名函数" id="i1">

    element=document.getElementById(‘i1‘);
    element.onclick=function () {
        console.log(‘测试匿名函数‘)
    }

JS条件判断语句

if (条件) {
    执行代码块
} else if (条件) {
    执行代码块
} else {
    执行代码块
};
 
 if(username == user && password ==passwd){
             console.log(‘登陆成功‘)
        }else if(username != user){
            console.log(‘用户名错误‘)
        }else{
            console.log(‘用户名或密码不正确‘)
        }

简单的数值匹配可以用switch判断,其中(a)里填写的是一个结果
switch (a) { case 1: console.log(111); break; case 2: console.log(222); break; default: console.log(333) }
//JS中条件判断时只要数值相同就算条件成立,如果想要数值和类型完全一样才成功要用===。
if(1==‘1‘){
console.log(条件成立)
}
if(1===‘1‘){
console.log(条件不成立)
}

JS循环语句

列表循环
第一种循环:循环的是角标

        var l = [‘奔驰‘,‘宝马‘,‘奥迪‘,‘凯迪拉克‘]; // 声明数组

        for (var i in l ){
            console.log(l[i])
        }

第二种循环:这种方式不支持字典的循环
  for (var i=0;i<l.length;i++){
            console.log(l[i])
        }

第三种循环
while (1 == 1) {
    console.log(111) //死循环
}

字典循环

var m={‘name‘:‘aa‘,‘pwd‘:123}

for (var k in m ){
     console.log(k); //取得是key
     console.log(m[k])  //取得是value
}

字符串循环  
          var s=‘测试循环字符串‘;
//          第一种方式
          for(var i in s){
              console.log(s[i])
          }
//          第二种方式
          for(var i=0;i<s.length;i++){
              console.log(s[i])
          }

 

 

HTML基础之JS

标签:bre   字符串   判断   demo   注释   修改   i++   confirm   input   

原文地址:https://www.cnblogs.com/tata-learning/p/12000289.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!