javascript基础一
来源:互联网 发布:汇编语言编程 编辑:程序博客网 时间:2024/06/18 12:49
1. 为什么学习JavaScript 一、你知道,为什么JavaScript非常值得我们学习吗? 1. 所有主流浏览器都支持JavaScript。 2. 目前,全世界大部分网页都使用JavaScript。 3. 它可以让网页呈现各种动态效果。 4. 做为一个Web开发师,如果你想提供漂亮的网页、令用户满意的上网体验,JavaScript是必不可少的工具。 二、易学性 1. 学习环境无外不在,只要有文本编辑器,就能编写JavaScript程序。 2. 我们可以用简单命令,完成一些基本操作。 三、从哪开始学习呢? 学习JavaScript的起点就是处理网页,所以我们先学习基础语法和如何使用DOM进行简单操作。 四、JavaScript能做什么? 1. 增强页面动态效果(如:下拉菜单、图片轮播、信息滚动等) 2. 实现页面与用户之间的实时、动态交互(如:用户注册、登陆验证等) 五、JS进阶篇学习什么? 在JavaScript入门篇中,我们学习了如何插入JS、输出内容及简单的DOM操作,JavaScript进阶篇让您进一步的了解JS的变量、数组、函数、语法、对象、事件、DOM操作,制作简单的网页动态效果。2. 如何插入JS 你只需一步操作,使用<script>标签在HTML网页中插入JavaScript代码。注意, <script>标签要成对出现,并把JavaScript代码写在<script></script>之间。 <script type="text/javascript">表示在<script></script>之间的是文本类型(text),javascript是为了告诉浏览器里面的文本是属于JavaScript语言。3. 我也可以独立(引用JS外部文件) JavaScript代码只能写在HTML文件中吗?当然不是,我们可以把HTML文件和JS代码分开,并单独创建一个JavaScript文件(简称JS文件),其文件后缀通常为.js,然后将JS代码直接写在JS文件中。 注意:在JS文件中,不需要<script>标签,直接编写JavaScript代码就可以了。 JS文件不能直接运行,需嵌入到HTML文件中执行,我们需在HTML中添加如下代码,就可将JS文件嵌入HTML文件中。 <script src="script.js"></script>4. 找到你的位置(JS在页面中的位置) 我们可以将JavaScript代码放在html文件中任何位置,但是我们一般放在网页的head或者body部分。 放在<head>部分 最常用的方式是在页面中head部分放置<script>元素,浏览器解析head部分就会执行这个代码,然后才解析页面的其余部分。 放在<body>部分 JavaScript代码在网页读取到该语句的时候就会执行。 注意: javascript作为一种脚本语言可以放在html页面中任何位置,但是浏览器解释html时是按先后顺序的,所以前面的script就先被执行。比如进行页面显示初始化的js必须放在head里面,因为初始化都要求提前进行(如给页面body设置css等);而如果是通过事件调用执行的function那么对位置没什么要求的。5. 认识语句和符号 JavaScript语句是发给浏览器的命令。这些命令的作用是告诉浏览器要做的事情。 每一句JavaScript代码格式: 语句; 先来看看下面代码 <script type="text/javascript"> alert("hello!"); </script> 例子中的alert("hello!");就是一个JavaScript语句。 一行的结束就被认定为语句的结束,通常在结尾加上一个分号";"来表示语句的结束。 看看下面这段代码,有三条语句,每句结束后都有";",按顺序执行语句。 <script type="text/javascript"> document.write("I"); document.write("love"); document.write("JavaScript"); </script> 注意: 1. “;”分号要在英文状态下输入,同样,JS中的代码和符号都要在英文状态下输入。 2. 虽然分号“;”也可以不写,但我们要养成编程的好习惯,记得在语句末尾写上分号。6. 注释很重要 注释的作用是提高代码的可读性,帮助自己和别人阅读和理解你所编写的JavaScript代码,注释的内容不会在网页中显示。注释可分为单行注释与多行注释两种。 我们为了方便阅读,注释内容一般放到需要解释语句的结尾处或周围。 单行注释,在注释内容前加符号 “//”。 <script type="text/javascript"> document.write("单行注释使用'//'"); // 我是注释,该语句功能在网页中输出内容 </script> 多行注释以"/*"开始,以"*/"结束。 <script type="text/javascript"> document.write("多行注释使用/*注释内容*/"); /* 多行注释 养成书写注释的良好习惯 */ </script>7. 什么是变量 什么是变量? 从字面上看,变量是可变的量;从编程角度讲,变量是用于存储某种/某些数值的存储器。 定义变量使用关键字var,语法如下: var 变量名 变量名可以任意取名,但要遵循命名规则: 1. 变量必须使用字母、下划线(_)或者美元符($)开始。 2. 然后可以使用任意多个英文字母、数字、下划线(_)或者美元符($)组成。 3. 不能使用JavaScript关键词与JavaScript保留字。 变量要先声明再赋值,如下: var mychar; mychar="javascript"; var mynum = 6; 变量可以重复赋值,如下: var mychar; mychar="javascript"; mychar="hello"; 注意: 1. 在JS中区分大小写,如变量mychar与myChar是不一样的,表示是两个变量。 2. 变量虽然也可以不声明,直接使用,但不规范,需要先声明,后使用。 表达式 操作符 “=” “+” 操作符之间的优先级(高到低): 算术操作符 → 比较操作符 → 逻辑操作符 → "="赋值符号 如果同级的运算是按从左到右次序进行,多层括号由里向外8. 判断语句 8.1 if...else语句是在指定的条件成立时执行代码,在条件不成立时执行else后的代码。 语法: if(条件) { 条件成立时执行的代码 } else { 条件不成立时执行的代码 } 假设我们通过年龄来判断是否为成年人,如年龄大于等于18岁,是成年人,否则不是成年人。代码表示如下: <script type="text/javascript"> var myage = 18; if(myage>=18) //myage>=18是判断条件 { document.write("你是成年人。");} else //否则年龄小于18 { document.write("未满18岁,你不是成年人。");} </script> 8.2 多种选择(Switch语句) 当有很多种选项的时候,switch比if else使用更方便。 语法: switch(表达式) { case值1: 执行代码块 1 break; case值2: 执行代码块 2 break; ... case值n: 执行代码块 n break; default: 与 case值1 、 case值2...case值n 不同时执行的代码 } 语法说明: Switch必须赋初始值,值与每个case值匹配。满足执行该 case 后的所有语句,并用break语句来阻止运行下一个case。如所有case值都不匹配,执行default后的语句。 注意:记得在case所执行的语句后添加上一个break语句。否则就直接继续执行下面的case中的语句。 8.3 重复重复(for循环) for语句结构: for(初始化变量;循环条件;循环迭代) { 循环语句 } 假如,一个盒子里有6个球,我们每次取一个,重复从盒中取出球,直到球取完为止。 <script type="text/javascript"> var num=1; for (num=1;num<=6;num++) //初始化值;循环条件;循环后条件值更新 { document.write("取出第"+num+"个球<br />"); } </script> 8.4 反反复复(while循环) 和for循环有相同功能的还有while循环, while循环重复执行一段代码,直到某个条件不再满足。 while语句结构: while(判断条件) { 循环语句 } 使用while循环,完成从盒子里取球的动作,每次取一个,共6个球。 <script type="text/javascript"> var num=0; //初始化值 while (num<=6) //条件判断 { document.write("取出第"+num+"个球<br />"); num=num+1; //条件值更新 } </script> 8.5 来来回回(Do...while循环) do while结构的基本原理和while结构是基本相同的,但是它保证循环体至少被执行一次。因为它是先执行代码,后判断条件,如果条件为真,继续循环。 do...while语句结构: do { 循环语句 } while(判断条件) 我们试着输出5个数字。 <script type="text/javascript"> num= 1; do { document.write("数值为:" + num+"<br />"); num++; //更新条件 } while (num<=5) </script> 8.6 继续循环continue continue的作用是仅仅跳过本次循环,而整个循环体继续执行。 语句结构: for(初始条件;判断条件;循环后条件值更新) { if(特殊情况) { continue; } 循环代码 } 上面的循环中,当特殊情况发生的时候,本次循环将被跳过,而后续的循环则不会受到影响。9. 什么是函数 函数是完成某个特定功能的一组语句。我们可以把完成特定功能的代码块放到一个函数里,直接调用这个函数,就省重复输入大量代码的麻烦。 如何定义一个函数呢?基本语法如下: function 函数名() { 函数代码; } 说明: 1. function定义函数的关键字。 2. "函数名"你为函数取的名字。 3. "函数代码"替换为完成特定功能的代码。 我们来编写一个实现两数相加的简单函数,并给函数起个有意义的名字:“add2”,代码如下: function add2(){ var sum = 3 + 2; alert(sum); } 函数调用: 函数定义好后,是不能自动执行的,所以需调用它,只需直接在需要的位置写函数就ok了。
0 0
- javascript基础实例教程(一)
- javascript(基础整理一)
- javascript基础一
- JavaScript入门基础 (一)
- javascript基础一
- Javascript基础(一)
- JavaScript 基础(一)
- javascript基础一
- javascript基础(一)
- JavaScript语言基础(一)
- Javascript基础(一)
- Javascript基础(一)
- javascript基础一
- JavaScript(一)-- 基础
- JavaScript进阶基础一
- javascript基础一
- JavaScript基础(一)
- javascript基础(一)
- IOS开发系列——Masonry手写Autolayout专题【整理,部分原创】
- HDOJ 3123 GCC (数学)
- ansible安装及问题解决
- android 之定义的栈来管理activity
- Android Studio的常见快捷键
- javascript基础一
- Property 属性动画入门
- 华为机试——判断两个IP时候属于同一个子网
- 各级数整理
- 编程基础学习地址收藏
- selector之按钮状态图片改变
- base64 编码图片
- 华为机试——单向链表倒数第k个结点
- Raspberry - First Step