3个小练习
- 打印倒正金字塔直线
- 验证邮箱地址
- 输入提示器
打印倒正金字塔直线
-
<body style="text-align:center;"> <script type="text/javascript">//style表示样式，text-align为文字位置属性，center表居中。text-align:center一般是用来规定文本和内联元素的水平居中对齐。img是内联元素 document.write("<h3>打印倒正金字塔直线</h3>"); var i= 61; while(i>0)//i循环7次,分别是61,51,41,31,21,11,1 { document.write("<hr width=" + i+"%/>");//<hr> 标签定义 HTML 页面中的主题变化（比如话题的转移），并显示为一条水平线。<hr> 元素被用来分隔 HTML 页面中的内容（或者定义一个变化）。 width是标签<hr>的宽度属性，%是width的值。HTML5 不支持 <hr> align 属性。请使用 CSS 代替。 i=i-10; } for(var j=11;j<70;j=j+10){//j循环6次 document.write("<hr width=" + j+"%/>"); } </script> </body>
验证邮箱地址：
- 定义一个有参函数来验证邮箱地址的有效性。
- 使用prompt()方法输入地址，默认值是[email protected]
- 邮箱地址输入正确，显示弹出框
- 正确的邮箱地址必须包含"@"和"."，输入不正确会有提示框
- 邮箱地址不能为空。
要求所示图：
-
<script type="text/javascript"> function validateEmail(email){//变量email=prompt("请输入正确的邮箱地址","[email protected]") var indexs=email.indexOf("@");//indexOf(str,index)方法，查找指定字符串首次出现的位置，从0开始查找 if(email.length>0){ if(indexs==-1|| email.indexOf(".")==-1)//-1代表查找不到 //if(email.indexOf("@"==-1 ||email.indexOf(".")==-1)) 这种写法也可以 alert("邮箱地址必须包含@和."); else{ var name=email.substring(0,indexs);//substring(index1,index2)返回index1-2之间的字符串，但不包括index2对应的字符。在这里是变量email对应的字符从0位置开始到@位置结束，但不包括@这个字符 alert("邮箱地址正确，邮箱名称是："+name); } }else{ alert("邮箱不能为空！"); } } validateEmail(prompt("请输入正确的邮箱地址","[email protected]"));//有参函数 </script>
这个练习还可以进一步进行拓展，比如说，如果输入错误，怎样可以在提示框后，重新输入，或者说如何在提示错误后立马进行重新输入。（待完成）！！！
输入提示器
- 输入“星期一”时，弹出“新的一周开始了”。
- 输入“星期二”，“星期三”，“星期四”时，弹出“努力工作”。
- 输入“星期五”时，弹出“明天就是周末了”。
- 输出其他内容，弹出“放松的休息”。
-
<script type="text/javascript"> function showDay(weekday){ switch(weekday){ case "星期一": alert("新的一周开始了"); break; case "星期五": alert("明天就是周末了"); break; case "星期二": case "星期三": case "星期四": alert("努力工作"); break; default: alert("放松的休息"); break; } } showDay(prompt('请输入今天是星期几：','星期一')); </script>
