web前端_js
在HTML中可以将JavaScript/JS的代码写在head中,被script标签所包裹,当浏览器解释HTML时,遇到style标签时,按照CSS规则解释,遇到Script标签时,按照JavaScript的语法规则解释
1.js的导入,建议将大的js的文件放到body内部的最下边,这样先加载静态信息,然后加载js
2.不可在导入的js标签内写js代码<script></script>
3.const 定义常量,var定义变量有预解析,let也可以定义变量没有预解析
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <!-- onclick点击事件,绑定了js中的f()函数--> <input type="text" placeholder="输入用户名" id="user"> <input type="password" placeholder="输入密码" id="pwd"> <input type="button" onclick="f()" value="login"> <br> <input type="button" onclick="f1()" value="for循环"> <br> <input type="button" onclick="f2()" value="switch循环"> <br> <input type="button" value="匿名函数测试" id="i1"> <br> <input type="button" onclick="f4()" value="变量" > <!--绑定js文件--> <!-- <input type="submit" onclick="f1()" value="跳转">--> <!--<script>--> <!-- function f() {--> <!-- // console.log('2312')//打印--> <!-- //alert('1232')//提示框--> <!-- confirm('确认框')//确认框--> <!-- }--> <!--</script>--> <script> function f() { var user = 'mh'; var pwd = '123456'; var u = document.getElementById('user').value; var p = document.getElementById('pwd').value; if (user==u && pwd==p){ alert('登录成功') } else { alert('用户名或密码错误') } } function f1() { // 打印数组 var l = ['a','b','c','d'] // for (var i in l){ // console.log(l[i]) // } // for (var i=0;i<l.length;i++){ // console.log(i) // } // 打印字典 var d = {'name':'mg','age':18} // for (var k in d){ // console.log(d[k]) // } //打印字典 var str = '没吃药' // for (var i=0;i<str.length;i++){ // console.log(str[i]) // } } function f2() { var uname = document.getElementById('user').value switch (uname) { case 'mh': console.log('shimh'); break; case 'hh': console.log('shihh'); break; default: console.log('xxxx') } } //匿名函数测试 e = document.getElementById('i1') e.onclick = function () { f2() } function f3() { var name = 'hh' console.log(name) } function f4() { console.log(name) } </script> <!--引入js文件--> <!-- <script src="6_demo.js"></script>--> </body> </html>