您的位置：首页 > Web前端 > JavaScript

初学JavaScript常用函数(五)

2017-02-22 14:37 411 查看
         JavaScript常用函数包括JavaScript全局函数和JavaScript window对象常用的方法及事件。JavaScript全局函数有7个，分别为：escape()函数、eval()函数、isNan()函数、ifFinite()函数、parseInt()函数、parseFloat()函数、unescape()函数、Eval()函数。

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>JS中常用函数</title>
</head>
<body>
<script type="text/javascript">
document.write("escape() 函数可对字符串进行编码，这样就可以在所有的计算机上读取该字符串<br>");
var str="escape%28%29%u662F%u5BF9%u5B57%u7B26%u4E32%u8FDB%u884C%u7F16%u7801%21";
var str1 = "escape()是对字符串进行编码!";
var str2 = "+-1*$%^";
var str3 = "+-1*%24%25%5E";
document.write(unescape(str)+"<br/>")
document.write(escape(str1)+"<br/>");
document.write(unescape(str2)+"<br/>");
document.write(unescape(str3)+"<br/>");

document.write("eval() 函数可计算某个字符串，并执行其中的的 JavaScript 代码。<br/>")
eval("x=20;y=10;document.write(x*y)");
document.write("<br/>");
document.write(eval("2+2"));
document.write("<br/>");
var str = 10;
document.write(eval(str+10)+"<br/>");

document.write("isNaN() 函数用于检查其参数是否是非数字值<br/>")
document.write(isNaN(123)+"<br/>");
document.write(isNaN(-1.23)+"<br/>");
document.write(isNaN(5-2)+"<br/>");
document.write(isNaN(0)+"<br/>");
document.write(isNaN("hello")+"<br/>");
document.write(isNaN("1+2")+"<br/>");

//isFinite() 函数用于检查其参数是否是无穷大
//如果 number 是有限数字（或可转换为有限数字），那么返回 true。否则，如果 number 是 NaN（非数字），
//或者是正、负无穷大的数，则返回 false。
document.write(isFinite(123)+ "<br />")
document.write(isFinite(-1.23)+ "<br />")
document.write(isFinite(5-2)+ "<br />")
document.write(isFinite(0)+ "<br />")
document.write(isFinite("Hello")+ "<br />")
document.write(isFinite("2005/12/12")+ "<br />")

//parseFloat() 函数可解析一个字符串，并返回一个浮点数。
//该函数指定字符串中的首个字符是否是数字。如果是，则对字符串进行解析，
//直到到达数字的末端为止，然后以数字返回该数字，而不是作为字符串。
document.write(parseFloat("10")+"<br/>");
document.write(parseFloat("10.00")+"<br/>") ;
document.write(parseFloat("10.33")+"<br/>") ;
document.write(parseFloat("34 45 66")+"<br/>");
document.write(parseFloat(" 60 ")+"<br/>") ;
document.write(parseFloat("40 years")+"<br/>");
document.write(parseFloat("He was 40")+"<br/>");
//parseInt() 函数可解析一个字符串，并返回一个整数。
document.write(parseInt("10")+"<br/>");			//返回 10
document.write(parseInt("19",10)+"<br/>");		//返回 19 (10+9)
document.write(parseInt("11",2)+"<br/>");		//返回 3 (2+1)
document.write(parseInt("17",8)+"<br/>");		//返回 15 (8+7)
document.write(parseInt("1f",16)+"<br/>");		//返回 31 (16+15)
document.write(parseInt("010")+"<br/>");		//未定：返回 10 或 8
</script>
</body>
</html>


      JavaScript window对象中常用的方法及事件：

     alert()方法：

     

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>JavaScript Window对象常用的方法及事件-alert()</title>
<script type="text/javascript">
//window可以省略
window.alert("window对象alert()方法");
</script>
</head>
<body>
</body>
</html>


      confirm()方法：

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>JavaScript对象confirm()方法</title>
<script type="text/javascript">
function func1(){
var x = window.confirm("点击确定按钮");
if(x==true){
x = "你点击了确定按钮";
}else{
x = "你点击了取消按钮";
}
document.getElementById("demo1").innerHTML=x;

}
</script>
</head>
<body>
<button onclick="func1()">点我</button>
<p id="demo1"></p>
</body>
</html>


      prompt()方法

      

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>JavaScript对象prompt()方法</title>
<script type="text/javascript">
function fun1(){
var x;
var person = window.prompt("请输入你的名字:", "PeterPan");
if(!person!=null && person!=""){
x="你好,"+person+":新年快乐!"
document.getElementById("demo").innerHTML=x;
}
}

</script>
</head>
<body>
<input type="button" value="点我" onclick="fun1()"/>
<p id="demo"></p>
</body>
</html>


     JavaScript对象setTimeout()方法

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>JavaScript对象setTimeout()方法</title>
<script type="text/javascript">

function func1(){
setTimeout(function(){alert("Hello,happy new year!")}, 5000);
}

function func2(){
alert("新年快乐!");
}
window.setTimeout("func2()", 3000);
</script>
</head>
<body>
<p>点击按钮，将在5秒钟出现提示。</p>
<button onclick="func1()">点击我</button>
</body>
</html>


    JavaScript对象setInterval()方法

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>JavaScript对象setInterval()方法</title>
<script type="text/javascript">
function fun1(){
var date = new Date();
var year = date.getFullYear();
var month = date.getMonth()+1;
var day = date.getDate();
var hour = date.getHours();
var minute = date.getMinutes();
var second = date.getSeconds();
var week = date.getDay();
switch(week){
case 0: week = "周日"; break;
case 1: week = "周一"; break;
case 2: week = "周二"; break;
case 3: week = "周三"; break;
case 4: week = "周四"; break;
case 5: week = "周五"; break;
case 6: week = "周六"; break;
default: week="逆天了!"; break;
}
var time = year+"年  "+month+"月  "+day+"日  "+week+" "+hour+"时  "+minute+"分  "+second+"秒";
document.getElementById("day1").innerHTML=time;
}

window.setInterval("fun1()", 1000);
</script>
</head>
<body>
<p id="day1"></p>
</body>
</html>

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>JavaScript对象setInterval()方法</title>
<script type="text/javascript">
function func1(){
var date = new Date();
var t = date.toLocaleTimeString();
document.getElementById("clock").value=t;
}
var time1 = window.setInterval("func1()", 1000);
</script>
</head>
<body>
<input type="text" id="clock" name="click"/>
<button onclick="window.clearInterval(time1)">停止</button>
</body>
</html>


JavaScript对象open()方法

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>JavaScript对象open()方法</title>
<script type="text/javascript">
function fun1(){
window.open("http://www.baidu.com");
}
</script>
</head>
<body>
<button onclick="fun1()">点我进百度</button>
</body>
</html>


JavaScript对象onload()方法

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>JavaScript对象onload方法()</title>
<script type="text/javascript">
/*
window.onload=function(){
alert("文档加载完毕!");
}
*/
function init(){
alert("文档加载完毕!");
}
</script>
</head>
<body onload="init()">

</body>
</html>


        JavaScript对象onresize()方法

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>JavaScript对象onresize()方法</title>
<script type="text/javascript">
window.onresize = function(){
alert("窗口发生变化!");
}
</script>
</head>
<body>

</body>
</html>
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航