图 4-1
代码解说
在上面的代码中,首先使用一个提示框提示用户输入一个数值:
var myNumber = prompt("Enter the number to be rounded","");
然后,将用户输入的数值显示在页面上以作参考,并输出一行描述信息:
document.write("h3The number you entered was " + myNumber + "/h3br");
document.write("pThe rounding results for this number are/p");
注意,在document.write()方法中,使用了HTML标记来格式化输出的内容。对于主标题,使用了h3标记,对于表格的描述信息,使用了段落标记p。
下面的代码则用于创建一个表格,以显示各方法取整的结果:
document.write("table width=150 border=1");
document.write("trthMethod/ththResult/th/tr");
document.write("trtdparseInt()/tdtd"+ parseInt(myNumber)
+ "/td/tr");
(本文来源于图老师网站,更多请访问http://m.tulaoshi.com/webkaifa/)document.write("trtdceil()/tdtd" + Math.ceil(myNumber)
+ "/td/tr");
(本文来源于图老师网站,更多请访问http://m.tulaoshi.com/webkaifa/)document.write("trtdfloor()/tdtd"+ Math.floor(myNumber)
+ "/td/tr");
(本文来源于图老师网站,更多请访问http://m.tulaoshi.com/webkaifa/)document.write("trtdround()/tdtd" + Math.round(myNumber)
+ "/td/tr");
(本文来源于图老师网站,更多请访问http://m.tulaoshi.com/webkaifa/)document.write("/table")
对于表格,首先创建了一个表头,然后对于每一个取整方法,使用了独立的一行来显示。可以看到,在JavaScript代码中,动态地创建Web页面的HTML标记是很容易的。动态地创建HTML标记的原则与在Web页面中使用HTML标记时是一样的:HTML标记的语法必须是有效的,否则页面上将显示出一些错误的信息或者什么都不显示。对于表格的每一行,创建的方法都是相同的,只是使用了不同的取整方法。对于表格的第一行,使用了parseInt()函数,代码如下所示:
document.write("trtdparseInt()/tdtd"+ parseInt(myNumber)
+ "/td/tr");
在向页面输出的document.write()方法中,首先使用了tr标记来创建表格的行,然后,使用td标记创建了一个表格单元,并将用于取整的方法名称parseInt()显示在表格单元中,最后以/td标记来结束这个单元格。接着用另一个tr标记创建第二个单元格,并将parseInt()函数取整之后的结果放在第二个单元格中,最后以/td标记结束第二个单元格,以/tr标记结束这个表格行。尽管parseInt()函数的返回值是数值类型,但是当它与字符串类型连接在一起时,JavaScript将把parseInt()函数的返回值自动转换为字符串类型,并与其他字符串连接在一起。这个转换是JavaScript在后台自动实现的,无须我们关心。