LOGO OA教程 ERP教程 模切知识交流 PMS教程 CRM教程 开发文档 其他文档  
 
网站管理员

javascript几大内置对象的详细实例讲解

admin
2010年8月18日 12:24 本文热度 3306

一:Javascript内置对象Math
1:Math.random() 代码实例


代码:


<html>
<head>
<title>用Math.random()得出0-1之间随机数的Javascript示例</title>
</head>
<body>
<script type="text/javascript">
document.write(Math.random())
</script>
<p>该Javascript示例解释:这个示例用到了Math.random(),这个函数返回值是一个大于等于0,且小于1的随机数。你可以测试一下,多点几次上面的蓝色按钮,会发现,每次出来的数字,都是随机的,不同的。</p>
</body>
</html>



2:得到一个0-10之间随机整数


代码:


<html>
<head>
<title>用Math.random()和Math.round得到一个0-10之间随机整数的Javascript示例</title>
</head>
<body>
<script type="text/javascript">
var vNum
vNum = Math.random()
vNum = Math.round(vNum*10)
document.write(vNum)
</script>
<p>该Javascript示例解释:这个示例用到了Math.random(),这个函数返回值是一个大于等于0,且小于1的随机数。得到随机数之后,将这个随机数乘以10,那么就得到一个大于等于0,小于10之间的数值,然后再用Math.round四舍五入一下,得到最接近的一个整数。这样最后返回的值是一个大于等于0,小于等于10的整数。</p>
</body>
</html>
3:用 Math.max 返回一个最大值


代码:


<html>
<head>
<title>用Math.max在众多数值里返回一个最大值的Javascript示例</title>
</head>
<body>
<script type="text/javascript">
document.write(Math.max(2,6,12,3,9,45,7))
</script>
<p>该Javascript示例解释:用Math.max(number1,number2,number3,…numberN)可以在n个数值中返回一个最大值。
</p>
</body>
</html>
4:用 Math.min 返回一个最小值


代码:


<html>
<head>
<title>用Math.min在众多数值里返回一个最小值的Javascript示例</title>
</head>
<body>
<script type="text/javascript">
document.write(Math.min(2,6,12,3,9,45,7))
</script>
<p>该Javascript示例解释:用Math.min(number1,number2,number3,…numberN)可以在n个数值中返回一个最小值。
</p>
</body>
</html>
5:使用 Math.round 四舍五入


代码:


<html>
<head>
<title>使用Math.round四舍五入返回最接近的整数的Javascript示例</title>
</head>
<body>
<script type="text/javascript">
document.write(Math.round(6.15))
document.write("<br>")
document.write(Math.round(6.5))
</script>
<p>该Javascript示例说明:用Math.round(number)可以返回参数number四舍五入后最接近整数的值。如果 number的小数部分大于等于0.5,返回值是大于number的最小整数。否则,round返回小于等于number 的最大整数。这个示例中,参数number分别是6.15和6.5,得出的结果分别是6和7。</p>
</body>
</html>
6:随机出图片的实例代码
以下内容需要回复才能看到


代码:


<html>
<head>
<title>一个随机出图片的Javascript示例(用到Math.random()和Math.round方法)</title>
</head>
<body>
<script type="text/javascript">
vNum = Math.random();
vNum = Math.round(vNum*10);
vNum="<img src = \"http://www.blabla.cn/images/js_tutorials/" + vNum + ".jpg\">"
document.write(vNum);
</script>
<p>该Javascript示例解释:首先使用Math.random()得到一个大于等于0,小于1的随机数;然后将随机数乘以10,得到一个大于等于0,小于10的数值;然后用Math.round四舍五入得到一个最接近的整数,这个整数在大于等于0,小于等于10的范围;然后将这个随机整数和HTML代码结合起来,就可以随机产生不同的图片。</p>
</body>
</html>


二:Javascript内置对象String
1:length 属性代码实例


代码:
<html>
<head>
<title>用length属性得到字符串长度的Javascript示例</title>
</head>
<body>


<script type="text/javascript">
var vText="I like blabla.cn"
document.write("<p>" + vText + "</p>")
document.write(vText.length)
</script>


<p>Javascript示例代码解释:首先声明一个变量vText,将"I like blabla.cn"赋值给vText,然后用document.write将其显示出来;然后用length属性,计算得出vText的长度,并将其显示出来,vText里面包含16个字符,空格也是计算在内的,最后得出结果就是16。如果你写中文,就会得出中文字符的长度。比如你写,"我就喜欢布啦布啦",就会得到这个字符串的长度,是8。
</p>


</body>
</html>
2:indexOf 方法代码实例


代码:


<html>
<head>
<title>用indexOf方法返回String对象内第一次出现子字符串的字符位置的Javascript示例</title>
</head>
<body>
<script type="text/javascript">
var vText="I like blabla.cn"
var vNo=vText.indexOf("b")
document.write("<p>" + vText + "</p>")
document.write(vNo)
</script>
<p>该Javascript示例代码解释:首先申明变量vText,将"I like blabla.cn"赋值给vText,然后声明另外一个变量vNo,vNo的值就是vText字符串中第一次出现"b"的位置数值,就是7。然后用 document.write将vText和vNo显示出来。
</p>
<p>这个示例用到String对象的indexOf方法,这个方法indexOf返回一个整数值,指出String对象内子字符串的开始位置。如果没有找到子字符串,则返回-1。
</p>
</body>
</html>
3:lastIndexOf 方法代码实例


代码:


<html>
<head>
<title>用lastIndexOf方法返回String对象内最后一次出现子字符串的字符位置的示例</title>
</head>
<body>
<script type="text/javascript">
var vText="I like blabla.cn"
var vNo=vText.lastIndexOf("b")
document.write("<p>" + vText + "</p>")
document.write(vNo)
</script>
<p>该Javascript示例代码解释:首先申明变量vText,将"I like blabla.cn"赋值给vText,然后声明另外一个变量vNo,vNo的值就是vText字符串中最后一次出现"b"的位置数值,就是10。然后用 document.write将vText和vNo显示出来。
</p>
<p>这个示例用到String对象的lastIndexOf方法,这个lastIndexOf方法返回一个整数值,指出String对象内子字符串的最后位置。如果没有找到子字符串,则返回-1。
</p>
</body>
</html>
4:substring 方法代码实例


代码:


<html>
<head>
<title>用substring方法返回一个字符串中指定那部分子字符串Javascript示例</title>
</head>
<body>
<script type="text/javascript">
var vText="I like blabla.cn"
var vSubText=vText.substring(7,13)
document.write("<p>" + vText + "</p>")
document.write(vSubText)
</script>
<p>该Javascript示例代码解释:首先申明变量vText,将"I like blabla.cn"赋值给vText,然后声明另外一个变量vSubText,变量vSubText的值为从vText第7个字符到第12个字符那部分,即"blabla",然后用document.write将vText和vSubText显示出来。</p>
<p>这个示例用到String对象的substring(start, end)方法, start表示子字符串的起始位置,end表示子字符串的结束位置,substring(start, end)方法会返回一个包含从start到end(注:不包含end)的子字符串。
</p>
</body>
</html>
5:substr 方法代码实例


代码:


<html>
<head>
<title>用substr方法返回从指定位置开始的指定长度的子字符串的Javascript示例</title>
</head>
<body>
<script type="text/javascript">
var s, ss;
s = "Desperate Housewives";
ss = s.substr(12, 5);
document.write(ss);
</script>
<p>该Javascript示例代码解释:首先申明变量s和ss,然后将"Desperate Housewives"赋值给s,然后用substr方法去从s的第13个字符取值,取5个字符,即"usewi",赋值给ss,然后用 document.write将ss显示出来。</p>
<p>这个示例用到String对象的substr(start [,length ])方法, start表示子字符串的起始位置,字符串中的第一个字符的索引为 0;length表示在返回的子字符串中应包括的字符个数。
</p>
</body>
</html>
6:toUpperCase 方法代码实例


代码:


<html>
<head>
<title>用toUpperCase方法将字符串中所有字母变成大写的Javascript示例</title>
</head>
<body>
<script type="text/javascript">
var vText="I like blabla.cn"
var vUpText=vText.toUpperCase(vText)
document.write("<p>" + vText + "</p>")
document.write(vUpText)
</script>
<p>该Javascript示例代码解释:首先申明变量vText,将"I like blabla.cn"赋值给vText,然后声明另外一个变量vUpText,用toUpperCase方法将vText所有字母变成大写,然后将值赋给 vUpText,然后用document.write将vText和vUpText显示出来。</p>
<p>这个示例用到String对象的toUpperCase方法,这个方法可以将所给字符串中的所有字母都被转化为大写字母。toUpperCase方法对非字母字符不会产生影响。
</p>
</body>
</html>


7:toLowerCase 方法代码实例
以下内容需要回复才能看到



代码:


<html>
<head>
<title>用toLowerCase方法将字符串中所有字母变成小写的Javascript示例</title>
</head>
<body>
<script type="text/javascript">
var vText="I like BLABLA.cn.我喜欢布啦布啦"
var vLowText=vText.toLowerCase(vText)
document.write("<p>" + vText + "</p>")
document.write(vLowText)
</script>
<p>该Javascript示例代码解释:首先申明变量vText,将"I like BLABLA.cn.我喜欢布啦布啦"赋值给vText,然后声明另外一个变量vLowText,用toLowerCase方法将vText所有字母变成小写,然后将值赋给vLowText,然后用document.write将vText和vLowText显示出来。</p>
<p>这个示例用到String对象的toLowerCase方法,这个方法可以将所给字符串中的所有字母都被转化为小写字母。toLowerCase方法对非字母字符不会产生影响。
</p>
</body>
</html>


三:Javascript内置对象Date
1:如何显示当天日期(yyyy-mm-dd)年,月,日


代码:
<html>
<head>
<title>如何显示当天日期(yyyy-mm-dd)的Javascript示例(用到Date对象的getFullYear,getMonth和getDate方法)</title>
</head>
<body>
<script type="text/javascript">
var d = new Date()
var vYear = d.getFullYear()
var vMon = d.getMonth() + 1
var vDay = d.getDate()
document.write(vYear)
document.write("-")
document.write(vMon<10 ? "0" + vMon : vMon)
document.write("-")
document.write(vDay<10 ? "0"+ vDay : vDay )
</script>
<p>Javascript示例代码解释:这个示例用到了Javascript内置对象Date的getFullYear,getMonth 和getDate方法。首先申明一个变量d,var d = new Date(),表示将当天的日期值赋给变量d。然后使用getFullYear得到年份的值,用getMonth得到月份值(注:getMonth返回值范围为0到11,所以要得到实际的月份,还要加1),用getDate得到当天日期所在月份的日期值。</p>
<p>这个示例还用到了"test?语句1:语句2",意思是如果符合test条件,那么执行语句1,否则使用语句2。计算月和日都用到了这个语法,如果月和日小于10,在月和日的值之前应该加0。</p>
</body>
</html>
2:如何显示当天时间(hh:nn:ss)时,分,秒


代码:


<html>
<head><title>如何显示当天时间(hh:nn:ss)的Javascript示例(用到Date对象的getHours,getMinutes和getSeconds方法)</title></head>
<body>
<script type="text/javascript">
var d = new Date()
var vHour = d.getHours()
var vMin = d.getMinutes()
var vSec = d.getSeconds()
document.write(vHour<10 ? "0" + vHour : vHour)
document.write(":")
document.write(vMin<10 ? "0" + vMin : vMin)
document.write(":")
document.write(vSec<10 ? "0"+ vSec : vSec )
</script>
<p>Javascript示例代码解释:这个示例用到了Javascript内置对象Date的getFullYear,getMonth 和getDate方法。首先申明一个变量d,var d = new Date(),表示将当天的日期值赋给变量d。然后使用getHours得到小时的值,用Minutes得到分钟值,用getSeconds得到秒的值。</p>
<p>这个示例还用到了"test?语句1:语句2",意思是如果符合test条件,就执行语句1,否则执行语句2。计算小时,分钟和秒都用到了这个语法,如果小时,分钟和秒小于10,在其值之前应该加0。</p>
</body>
</html>


四:Javascript内置对象Array
1:Javascript内置对象Array


代码:
<html>
<head>
<title>一个创建数组(Array),向数组赋值,并显示数组各项内容的Javascript示例</title>
</head>
<body>
<script type="text/javascript">
var aName = new Array(4)
aName[0] = "张靓颖"
aName[1] = "周笔畅"
aName[2] = "何洁"
aName[3] = "李宇春"


for (i=0; i<4; i++)
{
document.write(aName[i] + "
")
}
</script>
<p>该Javascript示例解释:首先用var aName = new Array(4),声明变量aName为一个数组(array),数组的大小为4;然后给数组的每项赋值,比如aName[0] = "张靓颖",表示数组第一项值为"张靓颖"(注: 数组下标是以0开始计,而不是以1开始计);最后用一个循环语句显示数组的每一项的值。
</p>
</body>
</html>
2: 数组的 length 属性


代码:
<html>
<head><title>一个数组(Array)的length属性示例(如果是连续数组,可以用其来求数组的元素个数)</title></head>
<body>


<script type="text/javascript">
var a = new Array( );
a[0] = "布啦布啦";
a[1] = "www.blabla.cn";
document.write (a.length);
</script>


<p>该Javascript示例解释:Javascript数组的length属性的返回值,是数组中所定义的最高位元素的下标加1后得出的值。


这个示例中,首先声明变量a为一个数组,然后向a的第一个元素赋值,即a[0] = "布啦布啦";然后向a的第二个元素赋值,即a[1] = "www.blabla.cn";最后显示变量a的length属性值为2,即变量a的元素最高下标为1,1+1就得到length的值。


如果是连续数组,可以用length属性来求数组的元素个数


注:因为一个数组中的元素并不一定是连续的,所以 length 属性也并不一定就等于数组中的元素个数。假设将a[1] = "www.blabla.cn"写成a[8] = "www.blabla.cn",数组变量a的length属性就会是9。
</p>


</body>
</html>
3:reverse 方法实例代码


代码:
<html>
<head><title>用reverse方法将Javascript数组(Array)对象内容反转的示例</title></head>
<body>


<script type="text/javascript">
var a,aa;
a = new Array(2,4,6,8,10);
aa = a.reverse();
document.write (aa);
</script>


<p>该Javascript解释:这个示例用到了Javascript数组(Array)的reverse方法,该方法能将数组的内容反转。


该示例中,首先声明了两个变量a和aa;然后定义a为数组,并赋值给a;然后用reverse方法将数组a的内容反转,并赋值给变量aa;最后用document.write显示数组aa的值。
</p>


</body>
</html>
4:concat 方法实例代码


代码:
<html>
<head>
<title>用concat方法将两个或更多数组组合在一起的Javascript示例</title>
</head>
<body>
<script type="text/javascript">
var a, b, c, d,e;
a = new Array(1,2,3);
b = new Array("布啦布啦", "blabla.cn");
c = "fine";
d = a.concat(b);
e = a.concat(b, c);
document.write(d + "
" + e);
</script>
<p>该Javascript示例解释:使用数组(Array)对象的concat方法,能将两个或更多数组组合起来。该示例中,首先声明变量a和b为数组,并赋值,声明c为一个字符串并赋值;然后用concat方法,其中d = a.concat(b),表示将a和b两个数组组合起来,并赋值给d,同样用concat方法,将a,b,c组合起来,并赋值给e;最后用 document.write将d, e分别显示出来。


注:concat(item1, item2, …, itemN)要加的项目(item1 … itemN)会按照从左到右的顺序添加到数组。如果该项目不是数组,就将其作为单个的数组元素添加到数组的末尾。
</p>
</body>
</html>
5:join 方法代码实例


代码:
<html>
<head>
<title>用join方法返回一个将数组所有元素用指定符号连在一起的字符串</title>
</head>
<body>
<script type="text/javascript">
var a, b;
a = new Array(0,1,2,3,4);
b = a.join("-");
document.write(b)
</script>
<p>该Javascript示例解释:首先声明变量a为数组,并赋值给a;然后用join方法定义连接符号为"-",然后赋值给b,并用document.write将b显示出来。


数组(Array)对象的join方法,会返回一个字符串,这个字符串包含了所给数组的所有元素,这些元素通过join方法作指定的连接符号连在一起。
</p>
</body>
</html>
6:pop() 方法实例代码


代码:
<html>
<head>
<title>用pop()方法移除数组中的最后一个元素并返回该元素的Javascript示例</title>
</head>
<body>
<script type="text/javascript">
var a, b;
a = new Array(0,1,2,3,4);
b = a.pop();
document.write(b + "
")
document.write(a)
</script>
<p>该Javascript示例解释:数组(Array)对象的pop()方法,用来移除数组中的最后一个元素并返回该元素。


这个示例中,b = a.pop(),表示移除数组a中最后一个元素,即4,并返回4。执行pop()方法之后,再显示数组a,你就会看到数组a比原来少了一个元素4。</p>
</body>
</html>
7:shift() 方法实例代码


代码:
<html>
<head>
<title>用shift()方法移除数组中的第一个元素并返回该元素的Javascript示例</title>
</head>
<body>
<script type="text/javascript">
var a, b;
a = new Array(0,1,2,3,4);
b = a.shift();
document.write(b + "
")
document.write(a)
</script>
<p>该Javascript示例解释:数组(Array)对象的shift()方法,用来移除数组中的第一个元素并返回该元素。


这个示例中,b = a.shift(),表示移除数组a中第一个元素,即0,并返回0。执行shift()方法之后,再显示数组a,你就会看到数组a比原来少了一个元素0。</p>
</body>
</html>
8:slice 方法实例代码


代码:
<html>
<head>
<title>用slice方法返回数组一部分的Javascript示例</title>
</head>
<body>
<script type="text/javascript">
var a;
a = new Array("a","b","c","d","e");
document.write(a.slice(0,3) + "
");
document.write(a.slice(-3,4) + "
");
document.write(a.slice(0,-1) + "
");
document.write(a.slice(1) + "
");
document.write(a.slice(4,3));
</script>


<p>该Javascript示例解释:这个示例用到了数组(Array)对象的Slice(start,[end])方法,该方法返回一个新数组,包含了源函数从start到 end 所指定的元素,但是不包括end元素,比如a.slice(0,3);如果 start 为负,将它作为 length + start处理,此处 length 为数组的长度,比如a.slice(-3,4),相当于a.slice(2,4)。如果 end 为负,就将它作为 length + end 处理,此处 length 为数组的长度,比如a.slice(0,-1)。如果省略 end ,那么 slice 方法将一直复制到源数组结尾,比如a.slice(1)。如果 end 出现在 start 之前,不复制任何元素到新数组中,比如a.slice(4,3)。</p>
</body>
</html>


该文章在 2010/8/18 12:24:02 编辑过
关键字查询
相关文章
正在查询...
点晴ERP是一款针对中小制造业的专业生产管理软件系统,系统成熟度和易用性得到了国内大量中小企业的青睐。
点晴PMS码头管理系统主要针对港口码头集装箱与散货日常运作、调度、堆场、车队、财务费用、相关报表等业务管理,结合码头的业务特点,围绕调度、堆场作业而开发的。集技术的先进性、管理的有效性于一体,是物流码头及其他港口类企业的高效ERP管理信息系统。
点晴WMS仓储管理系统提供了货物产品管理,销售管理,采购管理,仓储管理,仓库管理,保质期管理,货位管理,库位管理,生产管理,WMS管理系统,标签打印,条形码,二维码管理,批号管理软件。
点晴免费OA是一款软件和通用服务都免费,不限功能、不限时间、不限用户的免费OA协同办公管理系统。
Copyright 2010-2024 ClickSun All Rights Reserved