Javascript 基础

本文详细介绍了JavaScript的基础知识,包括HTML的<script>标签、变量、运算符、分支语句、消息框、函数、循环、事件等核心概念。通过实例演示了如何在网页中应用这些功能。

Javascript 基础
一、
1,Html的<script>标签用于把script代码嵌入到html页面中
 Document.write()用于向页面写入输出的文本
2,把javascript代码放在何处
   当页面被载入时会执行body部分的javascript代码
   当页面被调用时执行head部分的javascript代码(为了确保调用时已经被加载进来)
   如果很多页面都需要这段javascript代码,可以引用外部的js代码
   引用外部的js代码:<script te language=“javascript” type=“text/javascript “src=“ .js”>
3,javascript是浏览器的javascript引擎来解析的
4,javascript的注释
 单行注释    //
 多行注释    /*    */

二、Javascript变量
变量是用来存储信息的容器
规则:变量名区分大小写;变量名必须以字母或下划线开头
变量的声明和赋值:如果你给一个还没有声明的变量赋值,该变量会自动声明
x=5; carname="Volvo";

三、Javascript运算符
1,赋值运算符     =,+=…
2,算数运算符 + - * / %
3,比较运算符  ==,===,!=
4,逻辑运算符 &&,  ||  !
5,条件运算符 (三目运算符)
Variablename = (condition)?value1:value2

6、如果 把数字与字符串相加,结果将成为字符串
        var x = 10;
 var y = '20';
 document.write(x+y);

+:1,连接字符串,2,四则运算符
如果字符串和数值相加,结果会成为字符串

 var x = 100;
 var y = "100";
 //y = Number(y);
 //y = parseInt(y);
 alert(x+y);


 var x = 80;
 var y = "100";
 //y = Number(y);
 //y = parseInt(y);
 //alert(x+y);

var x = (x>90)?x:y;
alert(x);

四、Js分支语句
1,if,else,if…elseif..else
2,switch
Break的作用是防止代码自动执行到下一行
例:
<script type="text/javascript">
 var d = new Date();
 var time = d.getHours();
 alert(d);
 if(time<10){
  document.write('<b>good morning</b>');
 }else if(time>=10 && time<16){
  document.write('<b>good day</b>');
 }else{
  document.write('<b>hello world</b>');
 }
</script>

2,
<script type="text/javascript">
 var d = new Date();
 var time = d.getDay();
// alert(time);
 switch(time){
  case 5:
  document.write('finally Friday');
  break;
  case 6:
  document.write('super Saturday');
  break;
  case 0:
  document.write('Sleepy Sunday');
  break;
  default:
  document.write('i am looking forward to this weeked');
 }
</script>

五、Javascript消息框
1,警告框,alert()
2,确认框,confirm()
3,提示框,prompt()
1,警告框,点确定按钮后才能继续进行操作
2,确认框,需要点击确定或取消按钮才能继续进行操作,如果用户点击确认,返回值为true,点击取消返回值为false
3,提示框,用户进入某个页面前输入某个值,如果点击确认返回值为输入的值,如果取消,返回值为null

六、Javascript函数
函数包含的代码,只有在函数被调用时才执行
定义函数:function 函数名(参数列表){函数体}
          函数返回值必须使用return语句
Javascript变量的生存周期:
在一个函数内声明的变量,只能在该函数内访问,退出这个函数后,该变量自动释放。
可以在不同的函数中使用相同名称的变量,因为不同函数中的变量即使名称相同,作用域也不同
如果在函数外声明了一个变量,全局变量,页面上所有函数都可以访问它,生存周期为从声明开始到页面关闭

七、Javascript循环
1,for,循环执行指定次数
2,while,条件为true时循环执行代码
3,do…while…,先执行do语句的代码,再去判断while的条件
例:
1,
<script type="text/javascript">
 for(var i=0;i<=10;i++){
  document.write("the number is"+i);
  document.write("<br>");
 }
</script>

2,
 var i = 0;
 while(i<=10){
  document.write("the number is"+i);
  document.write("<br>");
  i = i+1;
 }

3,
var i =0;
 do{
  document.write("the number is"+i);
  document.write("<br>");
  i = i+1;
 }while(i<10)


用在循环中的break和continue
1,break,用来终止循环,继续执行循环之后的代码
2,continue,终止当前的循环,从下一个值继续执行

1,break

 for(var i=0;i<=10;i++){
  if(i==3){
   break;
  }
  document.write("the number is"+i);
  document.write("<br>");
 }

2,continue
 var i=0;
 for(i=0;i<=10;i++){
  if(i==3){
   continue;
  }
  document.write("the number is"+i);
  document.write("<br>");
 }

For…in
For…in声明用来遍历数组元素或对象属性
For...In声明中的代码每执行一次,就会对数组元素或对象属性进行一次操作
数组有几个元素或者对象有几个属性,循环执行几次
1,
 var x;
 var cars = new Array();
 cars['name'] = '保时捷';
 cars[1] = '奔驰';
 cars[2] = '大众';
 for(x in cars){
  document.write(cars[x]+"<br>");
 }

八、Javascript事件
事件举例:
1,鼠标点击
2,页面或图像载入
3,鼠标悬浮于某个热点之上
4,在表单中选取输入框
5,确认表单
6,键盘按键

事件通常与函数结合使用,事件触发时执行某个函数
1,
Onload 页面或图像被加载完
onUnload 离开页面
onblur, 元素失去焦点
Onchange,用户改变表单域的值
Onclick 鼠标点击某个表单
Ondblclick 鼠标双击某个对象
Onfocus 元素获得焦点
Onkeydown 某个键盘的键被按下
Onkeyup 某个键盘的键松开
Onkeypress 某个键盘的键被按住
Onmousedown 鼠标按键被按下
Onmousemove 鼠标移动
Onmouseout 鼠标从某元素移开
Onmouseover 鼠标被移到某元素之上
Onmouseup 某个鼠标按键被松开
Onreset 重置按钮被点击
Onresize 窗口或框架被调整尺寸
Onselect 文本被选中
Onsubmit 提交按钮被点击
Onsubmit=“”事件,验证表单函数的返回值是true 或 false
如果返回值为true则提交表单,如果返回值为false 不提交表单

Try…catch
作用是测试代码中的错误
在网页中捕获错误的方法:
1,try…catch…语句
2,throw()抛出异常

<html>
<head>
<script type="text/javascript">
 var txt = "";
 function message(){
  try{
   addlert('hello world');
  }
  catch(err){
   txt = "此页面存在一个错误\n\n";
   txt+="错误描述:"+err.description+"\n\n";
   txt+="点击确定继续";
   alert(txt);
  }
 }

</script>
</head>


<body>
<input type="button" value="view message" onclick="message()">
</body>
</html>

 

 

 

 

 

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值