alert 是弹窗动作
alert("list".length) 输出字符长度
alert(str1==str2) 判断两个值是否相等 相等输出
document.write("张小黑") 在页面输出
console.log("我在控制台输出了"); console.log 表示在控制台内输出字符 在页面不显示
<!doctype html> <html> <head> <meta charset="utf-8"> <title>点击弹框</title> <!-- 1.确定事件,点击事件 2.通常事件都会触发一个函数 3.函数里面通常会去操作页面,做一些交互动作 --> <script> function dianwo(){ alert("我被点击了"); } </script> </head> <body> <input type="button" value="点我,弹窗" onclick="dianwo()"/> </body> </html>点击按钮后 出现弹窗
文本替换
<!doctype html> <html> <head> <meta charset="utf-8"> <title>文本替换</title> <!-- 1.确定事件,点击事件 2.通常事件都会触发一个函数 3.函数里面通常会去操作页面,做一些交互动作 --> <script> function dianwo(){ //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>刚开始的页面
div.innerHTML
点击后
div.innerText
JS数据简单的校验
<!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("对不起,用户名太短! 需要输入6位数以上") 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> <form action="点击弹框.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>if(input1.value.length >= 6){ }else{ alert("对不起,用户名太短! 需要输入6位数以上") return false; }
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; }