0索引
- 基础语法
变量弱类型: varj= true
区分大小写
语句结束之后的分号,可以有,也可以没有
写在script标签|
JS的数据类型:
- 基本类型
string
number
boolean
undefine
null
- 引用类型
对象,内置对象
- 类型转换
-
JS的运算符和语句: .
运算符和java一样
"==="全等号:值和类型都必须相等
==值相等就可以了
语句和java一样 - JS的输出
alert()直接弹框
document.write() 向页面输出
console.log() 向控制台输出
innerHTML: 向页面输出
获取页面元素: document.getElementyld("id的名称":
- JS声明变量:
var变量的名称=变量的值
- JS声明函数:
var 函数的名称= function () {
}
function函数的名称 () {
}
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script> // <!--每句话之后有无；皆可--> var i=1; var j="123"; //alert("lisi".length);//直接弹框 var str1=123; var str2="123"; //lert(str1==str2);//true //alert(str1===str2);//false //向页面输出内容 document.write("好好学习"); //向控制台输出，通过检查可以在控制台看到输出 console.log("向控制台输出"); </script> </head> <body> </body> </html>
内容：
1. 确定事件 点击事件
2. 通常事件都会出发一个函数
3. 函数里面通常都会去操作页面元素,做一些交互动作
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script> function dianwo(){ //alert("我被点击了"); //1.首先要获得这个div var div = document.getElementById("div1") div.innerHTML = "<font color='red'>内容被替换掉了</font>"; // div.innerText = "<font color='red'>内容被替换掉了</font>"; } </script> </head> <body> <input type="button" value="点我,修改DIV中的内容" onclick="dianwo()" /> <div id="div1"> 这里的内容一会要被替换掉 </div> </body> </html>
修改前：
修改后：
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <!-- 1.校验用户名, 长度不能小于6位 1.确定事件: 提交事件 onsubmit 2.事件要触发函数 checkForm() 3. 函数中要去做一些校验 --> <script> function checkForm(){ //获取用户输入的内容 var input1 = document.getElementById("username"); // alert(input1.value); var uValue = input1.value; if(input1.value.length >= 6){ }else{ alert("对不起,用户名太短啦!") return false; } //邮箱的校验 //获取用户输入的邮箱的值 var email = document.getElementById("email") var uEmail = email.value; //判断内容为正则表达式 if(/^[a-z0-9]+([._\-]*[a-z0-9])*@([a-z0-9]+[-a-z0-9]*[a-z0-9]+.){1,63}[a-z0-9]+$/.test(uEmail)){ alert("校验成功"); }else{ alert("校验失败") return false; } return true;; } </script> </head> <body> <!--checkForm()值得注意的是他必须要有返回值--> <form action="../01-网站首页的优化/网站首页.html" onsubmit="return checkForm()" > 用户名:<input type="text" id="username" /><br /> 密码:<input type="password" id="password" /><br /> 邮箱:<input type="text" id="email" /><br /> <input type="submit" value="提交" /> </form> </body> </html>
-