今天学习了一下HTML 中JavaScript内容，觉得初学者需要注意下面几点：
<style type="text/css" >
table{
margin: 20px auto;
border: 5px solid orange;
}
td{
height: 40px;
line-height: 40px;
padding: 5px;
width: 200px;
background: rgba(100,20,10,0.3);
text-align: right;
}
select,input{
width:200px;
height:40px;
font-size:18px;
}
[type=radio]{
width: 30px;
height: 30px;
}
[type=submit],[type=reset]{
width: 140px;
border-radius: 30px;
font-size: 20px;
outline: none;
}
td:first-child{
width: 100px;s
}
</style>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
<script>
function displayDate(){
document.getElementById("demo").innerHTML=Date();
}
</script>
</head>
<body background-color: rgba(254,219,207,0.5);>
<style type="text/css" >
table{
margin: 20px auto;
border: 5px solid orange;
}
td{
height: 40px;
line-height: 40px;
padding: 5px;
width: 200px;
background: rgba(100,20,10,0.3);
text-align: right;
}
select,input{
width:200px;
height:40px;
font-size:18px;
}
[type=radio]{
width: 30px;
height: 30px;
}
[type=submit],[type=reset]{
width: 140px;
border-radius: 30px;
font-size: 20px;
outline: none;
}
td:first-child{
width: 100px;s
}
</style>
<table>
<tr>
<td>用户名：</td>
<td>
<input type="text" id="str1">
</td>
</tr>
<tr>
<td>
联系电话：
</td>
<td>
<input type="text" id="str2">
</td>
</tr><tr>
<td>
密码：
</td>
<td>
<input type="password" id="str3">
</td>
</tr><tr>
<td>
确认密码：
</td>
<td>
<input type="password" id="str4" onblur="check()">
</td>
</tr><tr>
<td>
性别：
</td>
<td>
<input type="radio" name="sex" id="sex">男
<input type="radio" name="sex" id="sex">女
</td>
</tr>
</tr><tr>
<td>
学历：
</td>
<td>
<select id="select">
<option value="高中">高中</option>
<option value="初中">初中</option>
<option value="小学">小学</option>
</select>
</td>
</tr>
</tr><tr>
<td colspan="2">
<input type="submit" id="btn1" >
<input type="reset" id="bt2" value="重置" onclick="cs()">
</td>
</tr>
</table>
</body>
<script type="text/javascript">
function $(id){
return document.getElementById(id)
}
function check(){
var boo=$(‘str3‘).value==$(‘str4‘).value
if (boo) {
return true
}else{
alert("密码错误！")
}
}
function cs(){
var str=‘‘
str+="\n用户名："
str+=$(‘str1‘).value;
str+="\n联系电话："
str+=$(‘str2‘).value;
str+="\n性别：";
str+=$(‘sex‘).checked?‘男‘:‘女‘;
str+="\n学历："
str+=$(‘select‘).value;
alert("用户信息:\n"+str);
}
</script>
}
</html>
原文：https://www.cnblogs.com/hbeksk/p/12420819.html