您的位置：首页 > Web前端 > JavaScript

JavaScript入门篇

2016-04-14 15:56 537 查看 
改文章是通过在慕课网学习的关于前端开发中，对javascript的学习总结。静态网页：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中的字符、符号等一定要在英文状态下输入吆。
表达式
表达式与数学中的定义相似，表达式是指具有一定的值、用操作符把常数和变量连接起来的代数式。[b]一个表达式可以包含常数或变量。[/b]
<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变量存储成绩，初值为80if(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);
                                            

                                        

                        
                        内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息 
                    

                    

                    

                        

                         标签： 
                                                

                        

                    


                

            


            

                
相关文章推荐

                

                
            

        

        

            

            
            

                

                    
新的分享

                    

                        
                    

                

            


            

                

                    
章节导航