JavaScript入门篇
来源:互联网 发布:内圆弧编程实例 编辑:程序博客网 时间:2024/06/13 05:22
静态网页:HTML+CSS;
动态网页:HTML+CSS+javaScript;
为什么学习JavaScript?
1. 所有主流浏览器都支持JavaScript。
2. 目前,全世界大部分网页都使用JavaScript。
3. 它可以让网页呈现各种动态效果。
JavaScript能做什么?
1.增强页面动态效果(如:下拉菜单、图片轮播、信息滚动等)
2.实现页面与用户之间的实时、动态交互(如:用户注册、登陆验证等)
怎么写JS代码?
方法1:使用<script>标签在HTML网页中插入JavaScript代码。注意, <script>标签要成对出现,并把JavaScript代码写在<script></script>
之间。
开始编写第一个代码,,依旧是用代码中最经典的hello world!为例:document.write("hello wrold!");
<html> <head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>sj 第一个代码</title></head><body> //<p id="p1">我是第一段文字</p> // <p id="p2">我是第二段文字</p> <script type="text/javascript">document.write("hello world!"); </script></body></html>
<script type="text/javascript">
表示在<script></script>之间的是文本类型(text),javascript是为了告诉浏览器里面的文本是属于JavaScript语言。
注意:1.一行的结束就被认定为语句的结束,通常在结尾加上一个分号";"
来表示语句的结束。
2. “;”分号要在英文状态下输入,同样,JS中的代码和符号都要在英文状态下输入。
3. 虽然分号“;”也可以不写,但养成好的编程习惯,记得在语句末尾写上分号。
方法2:除了可以把JS代码写在HTML文件中以外,还可以单独创建一个文件后缀为.js的JavaScript的文件。
在JS文件中,不需要<script>标签,直接编写JavaScript代码就可以了,以hello.js为文件名的代码如下:
document.write("hello world!");
JS文件不能直接运行,需嵌入到HTML文件中执行,需在HTML中添加如下代码,就可将JS文件嵌入HTML文件中。
<html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>引用JS文件</title><script src="hello.js"></script></head><body></body></html>
JS代码究竟放在HTML页面中的哪个位置?
可以将JavaScript代码放在html文件中任何位置,但是一般放在网页的head或者body部分。
放在<head>部分:
最常用的方式是在页面中head部分放置<script>元素,浏览器解析head部分就会执行这个代码,然后才解析页面的其余部分。
放在<body>部分:
JavaScript代码在网页读取到该语句的时候就会执行。
<span style="font-size:12px;"><!DOCTYPE HTML><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>JS代码的位置</title><script type="text/javascript"> document.write(" 在head中<br/>");</script></head><body><script type="text/javascript"> document.write("在body中");</script></body></html></span>
注意: javascript作为一种脚本语言可以放在html页面中任何位置,但是浏览器解释html时是按先后顺序的,所以前面的script就先被执行。比如进行页面显示初始化的js必须放在head里面,因为初始化都要求提前进行(如给页面body设置css等);而如果是通过事件调用执行的function那么对位置没什么要求的。
代码的注释,在任何一种编程语言中为了提高代码的可读性,帮助自己和别人阅读和理解你所编写的代码,都会在代码周围加上许多注释。
注释可分为单行注释与多行注释两种。单行注释,在注释内容前加符号 “//”,多行注释以"/*"开始,以"*/"结束。
<html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>隐藏的注释</title> <script type="text/javascript"> document.write("hello world"); // 我是单行注释 /*我 是 多 行 注 释 */ </script></head><body></body></html>
现在从对变量、数组、函数、语法、对象、事件、DOM操作进行了解,制作简单的网页动态效果。
什么是变量,从字面来说就是指可以改变值得量叫变量。从编程的角度上讲,变量是用于存储数值的容器,就像生活中的箱子、盒子一样。
在JS中定义变量的关键字为var,语法如下:
var 变量名
可以同时声明两个变量
var num1,mun2 ;
变量要先声明再赋值,如下:
var mychar;mychar="javascript";var mynum = 6;
变量可以重复赋值,如下:
var mychar;mychar="javascript";mychar="hello";
var num1 = 123; // 123是数值var num2 = "一二三"; //"一二三"是字符串var num3=true; //布尔值true(真),false(假)
注意:
1.必须以字母、下划线或美元符号开头,后面可以跟字母、下划线、美元符号和数字。如下:
正确: mysum _mychar $numa1
错误: 6num //开头不能用数字 %sum //开头不能用除(_ $)外特殊符号,如(% + /等) sum+num //开头中间不能使用除(_ $)外特殊符号,如(% + /等)
2.变量名区分大小写,如:A与a是两个不同变量。
3.不允许使用JavaScript关键字和保留字做变量名。
4.:变量也可以不声明,直接使用,但为了规范,需要先声明,后使用。
1. JS是区分大小写的,如:classname和ClassName是不一样的。同时注意方法、属性、变量等的大小写吆。2. JS中的字符、符号等一定要在英文状态下输入吆。
表达式
表达式与数学中的定义相似,表达式是指具有一定的值、用操作符把常数和变量连接起来的代数式。一个表达式可以包含常数或变量。
<html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>表达式</title><script type="text/javascript"> var num1=10; var num2=num1-5+6; <span style="color:#FF6666;">//数值表达式,值为数值</span> var str ="i"+"love"+"you"; <span style="color:#FF6666;"> //字符串表达式,值为字符串</span> var isTrue=num1>num2; <span style="color:#FF6666;"> //布尔值表达式,值为true或者false</span> document.write("小明还剩:"+num1+"元"+"<br>"); document.write("小红花:"+num2+"元买个铅笔盒"+"<br/>"); document.write(str+"<br/>"); document.write(isTrue);</script></head><body></body></html>
判断语句(if...else)
if...else语句是在指定的条件成立时执行代码,在条件不成立时执行else后的代码。不多解释,代码如下:<html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>判断语句</title> <script type="text/javascript">var score =80; //score变量存储成绩,初值为80 if(score>=60) { document.write("很棒,成绩及格了。");} else{ document.write("加油,成绩不及格。");} </script></head><body></body></html>
什么是函数(可以看做成java中的方法)
函数是完成某个特定功能的一组语句,可以把完成特定功能的代码块放到一个函数里,直接调用这个函数,就可以避免重复输入大量代码。
如何定义一个函数呢?基本语法如下:
function 函数名(){ 函数代码;}
说明:
1. function定义函数的关键字。
2. "函数名"你为函数取的名字。
3. "函数代码"替换为完成特定功能的代码。
function add2(){ var sum = 3 + 2; document.write(sum);}还可以有我把它叫做带有参数的函数,举例如下:add2();
function add2(a,b){sum = a + b;document.write(sum);} // 只需写一次就可以add2(3,2);add2(7,8);
- JavaScript -- 入门篇
- JavaScript入门篇<一>
- JavaScript入门篇
- JavaScript入门篇
- JavaScript 入门篇
- javaScript入门篇
- Javascript入门篇
- JavaScript入门篇
- JavaScript入门篇
- javascript入门篇
- javascript 第二篇(入门篇)
- javascript 第三篇(入门篇)
- javascript 第六篇(入门篇)
- javascript 第七篇(入门篇)
- JavaScript入门之基本概念篇
- JavaScript学习笔记-入门篇
- javascript入门篇之函数
- JavaScript入门篇--DOM操作
- Swift基础 - - 高德地图实践
- 神经网络入门--学习资源
- 数据库主从配置
- 关于加速度计
- spring mvc Json转换
- JavaScript入门篇
- xdoe7 Transport security has blocked a cleartext HTTP
- IDEA每次部署都把部署文件放在哪了?之前的tomcat下的work目录也找不到?
- 欢迎使用CSDN-markdown编辑器
- 获取Android中的SHA1方法
- 一步一步实现iOS微信自动抢红包(非越狱)
- AngularJS Directive 隔离 Scope ( "isolate" scope)与父scope交互问题
- C语言 输入两个数,输出大的那个
- 把数字和汉字分开