[HTML]Web前端开发技术26(HTML5、CSS3、JavaScript )JavaScript基础——喵喵画网页-LMLPHP

目录

前言

数据类型

数据类型-字符型

数据类型-数值型

数据类型-布尔型

数据类型-其它类型

变量

转义字符

运算符和表达式

算术运算符和表达式

关系运算符和表达式

关系运算符和表达式

逻辑运算符和表达式

赋值运算符和表达式

位运算符和表达式

条件运算符和表达式

课后练习

网页标题:事件处理程序返回值的应用

网页标题:表单控件焦点、表单提交、重置事件的应用

网页标题:用户登录验证

总结


前言


数据类型


数据类型-数值型


数据类型-布尔型


数据类型-其它类型


变量


转义字符


运算符和表达式


算术运算符和表达式

[HTML]Web前端开发技术26(HTML5、CSS3、JavaScript )JavaScript基础——喵喵画网页-LMLPHP


关系运算符和表达式

[HTML]Web前端开发技术26(HTML5、CSS3、JavaScript )JavaScript基础——喵喵画网页-LMLPHP


关系运算符和表达式

[HTML]Web前端开发技术26(HTML5、CSS3、JavaScript )JavaScript基础——喵喵画网页-LMLPHP


逻辑运算符和表达式

[HTML]Web前端开发技术26(HTML5、CSS3、JavaScript )JavaScript基础——喵喵画网页-LMLPHP


赋值运算符和表达式

[HTML]Web前端开发技术26(HTML5、CSS3、JavaScript )JavaScript基础——喵喵画网页-LMLPHP


位运算符和表达式


条件运算符和表达式


课后练习

网页标题:事件处理程序返回值的应用

<!doctype html>
<html>
<head>
<meta charset="utf-8">
	<title>事件处理程序返回值的应用</title>
	<script>
		function showName()
		{
			if(document.form1.name1.value=="")
			{
				alert("没有输入内容!");
				return false;
			}
			else
			{
				alert("欢迎你!"+document.form1.name1.value);
				return true;
			}
		}
	</script>
</head>
<body>
	<h4>事件处理程序返回值的应用</h4>
    <form name="form1" action="simple.html" onSubmit="return showName();">
    	姓名:<input type="text" name="name1">
        <input type="submit" value="提交">
    </form>
</body>
</html>

网页标题:表单控件焦点、表单提交、重置事件的应用


网页标题:用户登录验证

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>表单提交、重置事件的应用</title>
<style>
	input{font-family:Tahoma, Geneva, sans-serif;}
	fieldset{width:300px; height:150px;}
	form{text-align:center;}
</style>
<script>
	function $(id){return document.getElementById(id);}
	function submitTest()
	{
		if($("input1").value=="admin" && $("input2").value=="123")
			{alert("登录成功!"); return true;}
		else
		{
			alert("用户名或密码错误,请重新输入!");
			$("input1").value="";
			$("input2").value="";
			return false
		}
	}
	function resetTest()
	{
		alert("开始清空数据!");
	}
</script>
</head>

<body>
	<form name="form1" action="loginindex.html" method="post" onSubmit="return submitTest()" onReset="resetTest()">
    	<fieldset>
        	<legend>表单数据提交</legend>
            <br><label>用户名:</label><input type="text" id="input1">
            <br><br><label>密&emsp;码:</label><input type="password" id="input2">
            <br><br><input type="submit" value="提交">
            <input type="reset" value="重置">
        </fieldset>
    </form>
</body>
</html>

总结


[HTML]Web前端开发技术26(HTML5、CSS3、JavaScript )JavaScript基础——喵喵画网页-LMLPHP

02-18 10:31