JavaScript基础题
1、网页中有个字符串“我有一个梦想”,使用JavaScript获取该字符串的长度,同时输出字符串最后两个字。
答案:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>js</title>
</head> <body>
<script type="text/javascript">
var str = "我有一个梦想";
len = str.length;
st = str.substr(4,2);
document.write("字符串长度为:" + len + "<br>" + "字符串最后两个字为:" +st);
</script>
</body>
</html>
结果:
*还可以通过字符串长度.length属性来动态截取字符串*:
<script type="text/javascript">
var str = "我有一个梦想";
st = str.substr(str.length-2,2);
document.write("字符串最后两个字为:" +st);
</script>
结果:
2、制作成绩输出表,判断学生的成绩是否大于60,是的话在页面中输出“你及格了”,不是的话则输出“你不及格”。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>js</title>
</head> <body>
<script type="text/javascript">
function checktext() {
var str = document.getElementById("text").value;
if (str>60)
alert("你及格了");
else
alert("你不及格");
}
</script> 请输入成绩:<input type="text" id="text" />
<input type="button" onclick="checktext()" value="提交" />
</body>
</html>
结果:
3、输出九九乘法表
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>js</title>
</head> <body>
<script type="text/javascript">
var arr = new Array(new Array(),new Array(),new Array(),new Array(),new Array(),new Array(),new Array(),new Array(),new Array()); //定义二维数组
var i , j ; //i表示九九乘法表里的行,j表示列
for(j = 1 ; j <= 9 ; j++) {
for(i = 1 ; i <= 9 ; i++) {
if(j<=i)
arr[i-1][j-1] = i * j ;
}
}
for(i = 1 ; i <= 9 ; i++) {
for(j = 1 ; j <= 9 ; j++) {
if(j<=i)
document.write(" "+j+"*"+i+"="+arr[i-1][j-1]);
}
document.write("<br>");
}
</script>
</body>
</html>
效果:
4、页面中一个文本输入框,当该文本框获得焦点时,弹出一个窗口提示用户“你获得了文本框”;当文本框失去焦点时,弹出一个窗口提示用户“文本框失去了你“。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>js</title>
</head> <body>
<input type="text" onfocus="alert('你获得了文本框')" onblur="alert('文本框失去了你')" />
</body>
</html>
效果:
注意:alert()里面要用单引号,因为外面已经使用过双引号,如果继续使用双引号的话,提示框不会弹出
5、制作倒计时
eg:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>倒计时</title>
<script language="JavaScript">
var nextYear = new Date("1/1/2016"); //nextYear为2016年元旦那一天
var nowDay = new Date(); //nowDay为当前的时间
var seconds = nextYear.getTime() - nowDay.getTime(); //seconds是现在距离元旦的毫秒数
var days = Math.floor(seconds/(1000*60*60*24));
if(days > 0) {
document.write("距离元旦还有"+days+"天!");
}
else if(days == 0) document.write("今天就是元旦哦!祝你元旦快乐!");
else document.write("元旦已经过了呀!");
</script>
</head> <body> </body>
</html>
效果:(2015.12.8)
重要知识点:
(1)floor()函数:其功能是“向下取整”,或者说“向下舍入”,即取不大于x的最大整数(与“四舍五入”不同,下取整是直接取按照数轴上最接近要求的值左边的值,也就 是不大于要求的值的最大的那个)。
(2)getTime() 方法:getTime() 方法可返回距 1970 年 1 月 1 日之间的毫秒数。两个指定时间的getTime()方法相减,得到的是这两个指定时间相距的毫秒数。