循环与函数
循环
数值判断函数 isNaN()
自定义函数
匿名函数
函数的立即调用
按钮事件
ById方法
循环
for循环、while循环、do-while循环
for(初始化参数;循环条件;增量或者减量){
//js代码
}
while(循环条件){
//js代码
}
do{
//js代码
}while(条件)
其中do-while是先执行一次然后再判断。
for-in循环
遍历数组或者对指定对象的属性和方法进行遍历。
for(变量名 in 对象名){
//js语句
}
举例
<script type="text/javascript">
var arr = [1,2,3,4];
for(var i in arr){
document.write(arr[i]+"<br/>");
}
</script>
break、continue
break:退出整个循环。
continue:只是退出当前循环。
数值判断函数
isNaN() 检查参数是不是NaN,通常用于检测parseFloat()和parseInt()的结果,来判断它们表示的是不是合法的数字,也可以用来检查计算错误。比如:
document.write(isNaN(5-2));//false
document.write(isNaN("hello"));//true
自定义函数
语法格式
function 函数名([参数1,参数2…]){
//js代码
[return 返回值 ;]
}
函数调用
- 函数的调用与元素的事件结合使用,格式为
事件名 = “函数名()”;
- 在js代码中直接使用,格式为
函数名();
- 在js代码脚本代码中通过元素事件调用,格式为
事件名 = 函数名;
举例:
//定义showHello()函数
<script type = "text/javascript">
function showHello(){
for(var i = 0;i<5;i++){
document.write("<h3>Hello World!!"</h3>");
}
}
</script>
//1.添加<button>,单机按钮时调用函数。
<body>
<input type= "button" name = "btn" id = "btn" value = "显示信息" onclick="shouHello()" />
</body>
//2.在js代码中调用函数
<script type="text/javascript">
showHello();
</script>
//3.使用页面价值事件调用函数
<script type="text/javascript">
window.onload = showHello;
</script>
匿名函数
定义
function([参数1,2…]){
//js代码
}
调用匿名函数
匿名函数的整个语句可以像值一样赋给一个变量进行保存,也可以赋值给一个事件触发,所以可以用变量名或事件名调用匿名函数。
举例:
//1.赋值给变量
<script type = "text/javascript">
var show = function(){
document.write("hello world");
};
</script>
<body>
<input type="button" name="btn" id="btn" value="click" onclick="show()" />
</body>
//赋值给事件函数
<script type="text/javascript">
window.onload = function(){
document.getElementById("btn").onclick = function(){
var count = prompt("请输入计算的数");
alert(count+"的平方值是:"+count * count);
}
}
</script>
<body>
<input type="button" name="btn" id="btn" value="click" />
</body>
函数的立即执行
函数的立即调用,即使用括号将整个函数包起来,然后在跟一个括号填写参数。
举例
<script type="text/javascript">
(function(a,b){
console.log(a+b);
})(1,2)
</script>
按钮事件调用
在标签内添加onclick属性。
注意:button按钮内的name属性与id属性建议取一样的名字。
举例
<scirpt>
function showHello(){
alert("hello world!");
}
</script>
<body>
<input type="button" name = "btn" id = "btn" onclick = "showHello()" />
</body>
document.getElementById()方法 {#by.id}
对DOM对象进行操作,getElementById() 方法可返回对拥有指定 ID 的第一个对象的引用,相当于通过标签的id属性找到那个唯一的标签。
除了 getElementById() 之外。还有 getElementsByName() 和 getElementsByTagName()。
举例
<body>
<input type="text" id = "text1" />
<script type="text/javascript">
document.getElementById("text1").value = "hello js";
</script>
</body>