window.onload = function() { document.getElementById("btnm").onclick = function() { //设置div的内容 var divElt = document.getElementById("div1"); //innerHtml和innerText不是代码,是属性,和我们设置text的value原理相同 //innerHtml会把后面的字符串视为html代码,innerText视为字符串 divElt.innerHTML = "<font color='red'>哈哈哈哈哈哈哈哈哈</font>"; divElt.innerText = "<font color='red'>哈哈哈哈哈哈哈哈哈</font>"; } document.getElementById("password").onkeydown = function(event,b)//局部变量 { //获取键值 //回车键键值是13,ESC是27 //对于键盘事件来说,他都有keyCode属性用来获取键值 if(event.keyCode === 13) { //识别到回车键位提示正在登录 alert("正在登录") } } document.getElementById("myForm").onsubmit = function() { alert("正在登录") } document.getElementById("auto").onclick = function() { var ui = [false,true,1,2,"abc",3.14]; for(var i = 0; i < ui.length; i++) { alert(ui[i]); } for(var i in ui) { //这个var i不是数组的元素,而是数组的下标 alert(i);//显示都是下标的index alert(ui[i]); } } document.getElementById("tyo").onclick = function() { User = function(username,password) { this.username = username; this.password = password; } var u = new User("张三","12345"); alert(u["username"] + "," + u["password"]); //这个用在数组上是角标index,用在对象上,是对象的属性名,返回字符串 for(var value in u) { //属性名是一个字符串 alert(value); //本身就是一个字符串,直接放进去即可 alert(u[value]); } with(u) { //这种方式仅作了解,不要用尽量,不能所见即所得 alert(username + "," + password); } } } function vars() { alert("1"); }window.onload = function()
{
document.getElementById("btnm").onclick = function()
{
//设置div的内容
var divElt = document.getElementById("div1");
//innerHtml和innerText不是代码,是属性,和我们设置text的value原理相同
//innerHtml会把后面的字符串视为html代码,innerText视为字符串
divElt.innerHTML = "<font color='red'>哈哈哈哈哈哈哈哈哈</font>";
divElt.innerText = "<font color='red'>哈哈哈哈哈哈哈哈哈</font>";
}
document.getElementById("password").onkeydown = function(event,b)//局部变量
{
//获取键值
//回车键键值是13,ESC是27
//对于键盘事件来说,他都有keyCode属性用来获取键值
if(event.keyCode === 13)
{
//识别到回车键位提示正在登录
alert("正在登录")
}
}
document.getElementById("myForm").onsubmit = function()
{
alert("正在登录")
}
document.getElementById("auto").onclick = function()
{
var ui = [false,true,1,2,"abc",3.14];
for(var i = 0; i < ui.length; i++)
{
alert(ui[i]);
}
for(var i in ui)
{
//这个var i不是数组的元素,而是数组的下标
alert(i);//显示都是下标的index
alert(ui[i]);
}
}
document.getElementById("tyo").onclick = function()
{
User = function(username,password)
{
this.username = username;
this.password = password;
}
var u = new User("张三","12345");
alert(u["username"] + "," + u["password"]);
//这个用在数组上是角标index,用在对象上,是对象的属性名,返回字符串
for(var value in u)
{
//属性名是一个字符串
alert(value);
//本身就是一个字符串,直接放进去即可
alert(u[value]);
}
with(u)
{
//这种方式仅作了解,不要用尽量,不能所见即所得
alert(username + "," + password);
}
}
}function vars()
{
alert("1");
}
<!DOCTYPE html> <!-- 这是HTML的注释 --> <html lang="en" id="myHtml"> <head> <!-- 这里不是设置了编码,而是告诉浏览器,用什么编码方式打开文件避免乱码 --> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>HtmlAll</title> <style type="text/css"> #div1{ background-color: aquamarine; width: 300px; height: 300px; border: 1px solid black; position: relative; top: 100px; left: 100px; } </style> </head> <body> <script type="text/javascript" src="j.js"></script> <div id="div1"> <input type="text" id="email"> <span id="emailError" style="color: red; font-size: 12px;"></span> <br> <input type="button" value="验证邮箱" id="btn"/> </div> <div> <table align="center"> <form id="myForm"> <tr><td>登录窗口</td></tr> <tr> <td> <input type="text" id="username"/> </td> </tr> <tr> <td> <input type="password" id="password"/> </td> </tr> <tr> <td> <input type="submit" value="登录"/> </td> </tr> </form> </table> </div> <div> <!-- void运算符的语法是,执行运算符,但不返回任何结果 --> <!-- 让我们href的路径消失,用void不返回即可 --> <!-- javascript:void(0)我们的javascript是用来提示浏览器的,这是一段JS代码,这是不能省略的 --> <a href="javascript:void(0)" onclick="alert('test')">执行页面不跳转</a> <input type="button" onclick="vars()" value="123" /> <input type="button" id="auto" value="auto" /> <input type="button" id="tyo" value="tyo" /> <input type="button" value="设置div的内容" id="btnm"/> <!-- 正则表达式,主要用在字符串格式匹配方面 --> <!-- 正则表达式是独立的学科,在JAVA语言中支持,C和JS也支持 --> <!-- 怎么new对象怎么调用方法 --> <!-- .匹配除换行外的任意字符 \w匹配字母或数字或下滑线或汉字 \s匹配任意的空白符号 \d匹配数字 \b匹配单词的开始或结束 ^匹配字符串的开始 $匹配字符串的结束 *重复零次或更多次 +重复一次或更多次 ?重复零次或者一次 {n}重复n次 {n,}重复n次或更多次 {n,m}重复n到m次 --> <!-- \W匹配不是字母或数字或下滑线或汉字的任意 \S匹配不是空白符号的任意 \D匹配不是数字的任意 \B匹配不是单词的开始或结束的任意 [^x]匹配除了x以外的任意 [^aeiou]匹配除了aeiou以外的任意字符 --> <!-- 正则表达式小括号的优先级较高 --> </div> <script type="text/javascript"> // var regExp = /正则表达式/flags; // var regExp = new RegExp("正则表达式"); window.onload = function() { function Check() { var input = document.getElementById("email").value; var inputEmp = /^[A-Za-z0-9]+([-._][A-Za-z0-9]+)*@[A-Za-z0-9]+(-[A-Za-z0-9]+)*(\.[A-Za-z]{2,6}|[A-Za-z]{2,4}\.[A-Za-z]{2,3})$/; var boolean = inputEmp.test(input); if(!boolean) { //不合法 document.getElementById("emailError").innerText = "邮箱地址不合法"; } else { //合法 document.getElementById("emailError").innerText = "邮箱地址合法"; } } document.getElementById("btn").onclick = Check; document.getElementById("email").onfocus = function() { document.getElementById("emailError").innerText = ""; } document.getElementById("email").onkeydown = function(event) { if(event.keyCode === 13) { Check(); } } String.prototype.trim = function() { //prototype可以覆盖源代码 //后期拓展的trim函数直接去掉前后空白 return this.replace(/^\s+/,"").replace(/\s+$/,""); } document.getElementById("uxba").onclick = function() { var username = document.getElementById("asdzxcz").value; //去除空格 username = username.trim(); alert("["+username+"]"); } } </script> <div> <!-- QQ号正则表达式^[1-9][0-9]{4,}$ [1-9]表示一到九的数字出现一次 --> <!-- [A-Za-z0-9]表示任意一个字符出现一次 --> <!-- [A-Za-z0-9-+]表示以上的任意一个字符 --> <!-- 前面的-表示区间,单独出现则表示符号减号 --> <input type="text" id="asdzxcz"/> <input type="button" value="获取用户名" id="uxba"/> </div> </body> </html><!DOCTYPE html>
<!-- 这是HTML的注释 -->
<html lang="en" id="myHtml">
<head>
<!-- 这里不是设置了编码,而是告诉浏览器,用什么编码方式打开文件避免乱码 -->
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>HtmlAll</title>
<style type="text/css">
#div1{
background-color: aquamarine;
width: 300px;
height: 300px;
border: 1px solid black;
position: relative;
top: 100px;
left: 100px;
}
</style>
</head>
<body>
<script type="text/javascript" src="j.js"></script>
<div id="div1">
<input type="text" id="email">
<span id="emailError" style="color: red; font-size: 12px;"></span>
<br>
<input type="button" value="验证邮箱" id="btn"/>
</div>
<div>
<table align="center">
<form id="myForm">
<tr><td>登录窗口</td></tr>
<tr>
<td>
<input type="text" id="username"/>
</td>
</tr>
<tr>
<td>
<input type="password" id="password"/>
</td>
</tr>
<tr>
<td>
<input type="submit" value="登录"/>
</td>
</tr>
</form>
</table>
</div>
<div>
<!-- void运算符的语法是,执行运算符,但不返回任何结果 -->
<!-- 让我们href的路径消失,用void不返回即可 -->
<!-- javascript:void(0)我们的javascript是用来提示浏览器的,这是一段JS代码,这是不能省略的 -->
<a href="javascript:void(0)" οnclick="alert('test')">执行页面不跳转</a>
<input type="button" οnclick="vars()" value="123" />
<input type="button" id="auto" value="auto" />
<input type="button" id="tyo" value="tyo" />
<input type="button" value="设置div的内容" id="btnm"/>
<!-- 正则表达式,主要用在字符串格式匹配方面 -->
<!-- 正则表达式是独立的学科,在JAVA语言中支持,C和JS也支持 -->
<!-- 怎么new对象怎么调用方法 -->
<!-- .匹配除换行外的任意字符
\w匹配字母或数字或下滑线或汉字
\s匹配任意的空白符号
\d匹配数字
\b匹配单词的开始或结束
^匹配字符串的开始
$匹配字符串的结束
*重复零次或更多次
+重复一次或更多次
?重复零次或者一次
{n}重复n次
{n,}重复n次或更多次
{n,m}重复n到m次 -->
<!-- \W匹配不是字母或数字或下滑线或汉字的任意
\S匹配不是空白符号的任意
\D匹配不是数字的任意
\B匹配不是单词的开始或结束的任意
[^x]匹配除了x以外的任意
[^aeiou]匹配除了aeiou以外的任意字符 -->
<!-- 正则表达式小括号的优先级较高 -->
</div>
<script type="text/javascript">
// var regExp = /正则表达式/flags;
// var regExp = new RegExp("正则表达式");
window.onload = function()
{
function Check()
{
var input = document.getElementById("email").value;
var inputEmp = /^[A-Za-z0-9]+([-._][A-Za-z0-9]+)*@[A-Za-z0-9]+(-[A-Za-z0-9]+)*(\.[A-Za-z]{2,6}|[A-Za-z]{2,4}\.[A-Za-z]{2,3})$/;
var boolean = inputEmp.test(input);
if(!boolean)
{
//不合法
document.getElementById("emailError").innerText = "邮箱地址不合法";
}
else
{
//合法
document.getElementById("emailError").innerText = "邮箱地址合法";
}
}
document.getElementById("btn").onclick = Check;
document.getElementById("email").onfocus = function()
{
document.getElementById("emailError").innerText = "";
}
document.getElementById("email").onkeydown = function(event)
{
if(event.keyCode === 13)
{
Check();
}
}
String.prototype.trim = function()
{
//prototype可以覆盖源代码
//后期拓展的trim函数直接去掉前后空白
return this.replace(/^\s+/,"").replace(/\s+$/,"");
}
document.getElementById("uxba").onclick = function()
{
var username = document.getElementById("asdzxcz").value;
//去除空格
username = username.trim();
alert("["+username+"]");
}
}
</script>
<div>
<!-- QQ号正则表达式^[1-9][0-9]{4,}$
[1-9]表示一到九的数字出现一次 -->
<!-- [A-Za-z0-9]表示任意一个字符出现一次 -->
<!-- [A-Za-z0-9-+]表示以上的任意一个字符 -->
<!-- 前面的-表示区间,单独出现则表示符号减号 -->
<input type="text" id="asdzxcz"/>
<input type="button" value="获取用户名" id="uxba"/>
</div>
</body>
</html>
56
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
