JavaScript基础

1.JavaScript的基本结构
<script type="text/javascript">
    <!—
          JavaScript 语句;
    —>
</script >

2.JavaScript的应用
……
<title>初学JavaScript</title>
</head>
<body>
<script type="text/javascript">
    document.write("初学JavaScript");
    document.write("<h1>Hello,JavaScript</h1>");//浏览器输入方法 document.write("");//中间可以插入标签
// <script>…</script>可以包含在文档中的任何地方,只要保证这些代码在被使用前已读取并加载到内存即可
</script>
</body>
</html>
3.网页中引用JavaScript的方式
(1.)使用<script>标签
(2.)外部JS文件
<script src="export.js"  type="text/javascript"></script>
//在外部创建.js文件,src="export.js"


(3.)直接在HTML标签中
<input name="" type="button" value="按钮"   
   οnclick="javascript:alert('欢迎你');"/>
//onclick表示点击之后需要运行的程序//alert("");表示浏览器输出提示框信息

4.核心语法—变量


//类似于java面向对象

5.核心语法—数据类型

数据类型 
undefined
var width;
变量width没有初始值,将被赋予值undefined
null表示一个空值,与undefined值相等
number
var iNum=23;   //整数
var iNum=23.0;   //浮点数
booleantrue和false
string

一组被引号(单引号或双引号)括起来的文本
var string1="This is a string";






6.核心语法— typeof运算符

利用typeof判断返回值类型

typeof"John"// 返回 string 
typeof 3.14// 返回 number
typeof false// 返回 boolean
typeof [1,2,3,4]// 返回 object
typeof {name:'John',age:34}// 返回 object


7.核心语法—String对象

//var str="this is JavaScript";
//var strLength=str.length;    //长度是18

方法名称说      明
charAt(index)返回在指定位置的字符
indexOf(str,index)查找某个指定的字符串在字符串中首次出现的位置
substring(index1,index2)返回位于指定索引index1和index2之间的字符串,并且包括索引index1对应的字符,不包括索引index2对应的字符
split(str)返回位于指定索引index1和index2之间的字符串,并且包括索引index1对应的字符,不包括索引index2对应的字符





8.核心语法—数组2-1


9.核心语法—数组2-2

数组的常用属性和方法

类别名称描述
属性length设置或返回数组中元素的数目
方法join( )把数组的所有元素放入一个字符串,通过一个的分隔符进行分隔
方法
sort()对数组排序
方法push()向数组末尾添加一个或更多 元素,并返回新的长度




10.核心语法—运算符号

类型运算符
算术运算符+    -   *    /    %    ++    — 
赋值运算符=    +=   -=
比较运算符>    <     >=      <=     ==    !=   ===   !==
逻辑运算符&&      ||     !




11.核心语法—逻辑控制语句

if条件语句
switch多分支语句
for、while循环语句
for-in

//类似于java面向对象

for(var i in fruit){
       document.write(fruit[i]+"<br/>");
}
//类似于加强for循环
//虽然加强for循环也可以用

12.核心语法—常用的输入/输出

alert()//alert("提示信息");
prompt()//prompt("提示信息", "输入框的默认信息");

13.常用系统函数
parseInt ("字符串")
将字符串转换为整型数字
如: parseInt ("86")将字符串“86“转换为整型值86
parseFloat("字符串")
将字符串转换为浮点型数字
如: parseFloat("34.45")将字符串“34.45“转换为浮点值34.45
isNaN()
用于检查其参数是否是非数字



14.自定义函数

function 函数名(返回值){
     //JavaScript语句
     [return 返回值]
}
//函数调用
<input name="" type="button"
   value="按钮"  οnclick="函数名" />

练习

(1)编写函数,实现使用prompt输入两个数和运算符号,并计算两个数的操作结果


<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript">
			function study(){
				var num1=prompt("输入第一个数字");
				var num2=prompt("输入第二个数字");
				num1=parseInt(num1);
				num2=parseInt(num2);
				var h=prompt("输入运算符");
				var result;
				switch (h){
					case "+":
					result=num1+num2
						break;
					case "-":
					result=num1-num2
						break;
					case "*":
					result=num1*num2
						break;
					case "/":
					result=num1/num2
						break;
					default:
					alert("输入错误!");
						break;
				}
				alert("结果:"+result);
			}
		</script>
	</head>
	<body>
		<input type="button"  value="计算数值" οnclick="study()"/>
	</body>
</html>

(2)

使用prompt()方法输入考试科目的数量,要求数量必须是非零、非负数的数值类型,否则给出相应提示并退出程序
根据考试科目的数量,使用prompt()方法输入各科的考试成绩并累加,要求成绩必须是非负数的数值类型,否则给出相应提示并退出程序
如果各项输入正确,则弹出总成绩
     

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript">
				function A(){
					var num=prompt("请输入考试科目数");
				result=0;
				if(num<=0||isNaN(num)){
					alert("输入错误!");
					return;
				}else{
					for(var i=0;i<num;i++){
						var num1=prompt("请输入第"+(i+1)+"门成绩");
						if(num1<=0||isNaN(num1)){
					alert("输入错误!");
					return;
				}else{
					num1=parseFloat(num1);
					result+=num1
				}
					}
					
				}
				alert("结果"+result);
				}
		</script>
	</head>
	<body>
		<input type="button" name="" id="" value="统计考试科目" οnclick="A()"/>
	</body>
</html>



  • 0
    点赞
  • 13
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值