码迷,mamicode.com
首页 > 其他好文 > 详细

2017年5月29号课堂笔记

时间:2017-05-29 18:19:07      阅读:236      评论:0      收藏:0      [点我收藏+]

标签:his   作用   put   lang   输出   china   japan   扯淡   define   

2017年5月29号 阴天 空气质量:良

内容:JavaScript基础:输入输出及确认,统计字符出现的次数,系统函数,自定义函数,

自定义函数和事件的连用,四则运算小练习,方法的作用域

JavaScriptBOM对象(下次课堂笔记再补上,一起记录)history,location,open,document

一、输入输出及确认

 仿写老师代码:

<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>输入输出以及确认</title>
</head>
<body>
<script type="text/javascript">
/**
* 01. alert("提示框")!只有一个确定按钮
* 02. prompt("请输入您的年龄","50"); 有确认和取消按钮
* 001.第一个参数是 提示信息!
* 002.第二个参数是默认值,可以省略!
* 003.返回的内容就是用户输入的值
* var input=prompt("请输入您的年龄");
* alert(input);
* 004.如果用户没有输入内容或者点击取消,返回null
* 03.confirm("提示信息")
* 001.点击确定返回true
* 002.点击取消或者X 返回 false
*/
/* alert("hello");*/
/* var a=prompt("今天下雨吗","下");
alert (a);*/

if(confirm("不能踢球开心吗?")){
alert("扯淡");
}else{
alert("下次再踢喽");
}
</script>
</body>
</html>

二、统计字符出现的次数

 仿写老师代码:

<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>小练习-统计字符出现次数</title>
</head>
<body>
<script type="text/javascript">
var arr=["America","Britain","China","France","Germany","Japan","Russia"];
var count=0;
for(var i in arr){
document.write(arr[i]+"<br/>");
if(arr[i].indexOf("a")>-1||arr[i].indexOf("A")!=-1){
count++;
}
}
document.write("包含a或者A的单词数:"+count);
</script>
</body>
</html>

三、系统函数

 仿写老师代码:

 

<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>系统函数</title>
</head>
<body>

<script type="text/javascript">
/*parseInt("字符串"): 遇到第一个非数字的时候,能把之前的数字转换!
* parseFloat("字符串"): 遇到第一个非数字的时候,能把之前的数字转换!
* 如果第一个字符就是非数字,那么返回NaN
* */
document.write(parseInt("52a")+"<br/>");
document.write(parseFloat("52.2a56")+"<br/>");
document.write(parseFloat("a25.23")+"<br/>");
//isNaN("参数") 01.参数是数字 返回false 02. 参数是非数字 返回true
document.write(isNaN(10)+"<br/>");
/*Number("参数") 参数必须是全数字类型的字符串,否则返回NaN*/
document.write(Number("10a5")+"<br/>");
document.write(Number("105.5")+"<br/>");

/**
*Boolean(参数):
* 如果参数是空,null,undefined,NaN,false ,0或者未定义的变量 都返回false!
* 其他都是返回true!
*/
document.write(Boolean("a")+"<br/>");
document.write(Boolean("")+"<br/>");
document.write(Boolean(null)+"<br/>");
document.write(Boolean(false)+"<br/>");
document.write(Boolean(NaN)+"<br/>");
document.write(Boolean(0)+"<br/>");
document.write(Boolean(undefined)+"<br/>");


</script>
</body>
</html>

四、自定义函数

 仿写老师代码:

 

<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>自定义函数</title>
</head>
<body>

<script type="text/javascript">
/**
定义函数! 通常结合事件一起使用!
语法 :
function 方法名([参数...]){
//js代码
[return ...]
}
或者
var 方法名=function(){

}
*/
//定义求和的方法(函数)
function getSum(num1,num2){
return num1+num2;
}
document.write(getSum(1,2));

//如果和事件同时使用 事件="函数();"

</script>
</body>
</html>

五、 自定义函数和事件的连用

 仿写老师代码:

 

<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>自定义函数和事件</title>
</head>
<body>
<!--如果和事件同时使用 事件="函数();"-->
<!--点击事件 onclick="getSum(5,5);" -->
<!--鼠标悬停事件 onmouseover="getSum(5,5);"-->
<!--鼠标移出事件 onmouseout="getSum(5,5);"-->
<button type="button" onmouseout="getSum(10,10)" >点击求和</button>

<!--文本框获取焦点事件 onfocus="getSum(5,5);"-->
<!--文本框失去焦点事件 onblur="getSum(5,5);"-->

<input type="button" value="大家辛苦了" onblur="getSum(5,5)"/>

<script type="text/javascript">
//定义求和的方法(函数)
function getSum(num1,num2){
alert(num1+num2);
}
</script>


</body>
</html>

六、四则运算小练习

 仿写老师代码:

 

<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>

<button type="button" onclick="calculate()">两个数字的四则运算结果</button>

<script type="text/javascript">


var calculate=function(){
var num1=prompt("请输入第1个数字");
var num2=prompt("请输入第2个数字");
var sign=prompt("请输入运算符号");
var result;
num1=parseFloat(num1);
num2=parseFloat(num2);
switch(sign){
case "+":
var result=num1+num2;
break;
case "-":
var result=num1-num2;
break;
case "*":
var result=num1*num2;
break;
case "/":
var result=num1/num2;
break;

}
alert("两数计算结果为:"+result);
}


</script>
</body>
</html>

 

七、方法的作用域

 仿写老师代码:

 

<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>方法的作用域</title>
</head>

<body onload="second()">
<script type="text/javascript">
var i=50;
function first(){
var i=5;
for(var j=0;j<i;j++){
document.write(j+"<br/>");
}
}
function second(){
var temp=prompt("请输入一个数字");
if(temp>i){
document.write(temp+"<br/>");
}else{
document.write(i+"<br/>");
}
first();
}



</script>


</body>

</html>

 

八、作业

1、jQuery第一节MindManager

2、继续看视频

九、老师辛苦了!

技术分享

 

2017年5月29号课堂笔记

标签:his   作用   put   lang   输出   china   japan   扯淡   define   

原文地址:http://www.cnblogs.com/wsnedved2017/p/6918212.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!