JavaScript基础

来源：互联网发布：淘宝付款不发货骗术编辑：程序博客网时间：2024/04/30 13:21

1、document.write:只是在Javascript中直接使用 document.write会在已有的html内容后面添加。如果您在文档加载后使用该方法，会覆盖整个文档。

2、alert('This is test!') 函数在 JavaScript 中并不常用，但它对于代码测试非常方便。

3、JS改变html内容：

var x=document.getElementById("demo")  //查找元素x.innerHTML="Hello JavaScript";

4、JavaScript的函数和事件：(1)、函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块。

(2)、类似于document.write这样的语句，会在页面加载的时候执行，通常，我们需要在某个事件发生时执行代码，比如当用户点击按钮时，如果我们把JavaScript代码放入函数中，就可以在事件发生时调用该函数。在希望退出函数时，也可使用return语句

(3)、事件：①onclick：当用户点击鼠标时调用 ②onload：当用户加载网页时调用 ③onunload：当用户离开界面时调用 ④onchange：当输入内容改变时调用 ⑤onmouseover：当用户的鼠标移动到HTML元素上时调用 ⑥onmouseout：当用户的鼠标移出HTML元素时调用 ⑦onmousedown：当鼠标按下时调用 ⑧onmouseup：当鼠标释放时调用 ⑨onfocus：当获取焦点时调用 ⑩onerror：在加载文档或图像发生错误时调用

5、外部的JavaScript：通常我们可以把脚本保存到外部文件中，外部文件通常包含多个网页使用的代码，外部JavaScript文件的文件扩展名为.js，如需使用外部文件，请在<script>标签的"src"属性中设置该.js文件(在<head>或<body>中引用脚本文件都是可以的)，需要注意的是外部脚本不能包含<script>标签。

<script src="myScript.js"></script>

6、JavaScript对大小写敏感：当编写JavaScript语句时，要留意是否关闭大小写切换键，函数getElementById与getElementbyID是不同的。

7、JavaScript会忽略多余的空格，可以向脚本中添加空格来提高可读性，下面两行代码是等效的：

var name="Hello";var name = "Hello";

8、JavaScript 是脚本语言。浏览器会在读取代码时，逐行地执行脚本代码。而对于传统编程来说，会在执行前对所有代码进行编译。

9、JavaScript变量：JavaScript变量用于存放值，JavaScript变量均为对象，当声明一个变量时就创建了一个对象。变量可以使用短名称（比如x和y），也可以使用描述性更好的名称（比如age，sum），变量的命名要求如下：

(1):变量必须以字母开头 (2):变量也能以$和_开头（不过不推荐） (3):变量名称对大小写敏感(即y和Y是不同的变量)

通常我们使用var关键字来声明变量，且一条语句可以声明多个变量，用逗号隔开，通常声明的变量没有赋值时，他们实际上等于undefined，undefined这个值表示变量不含值，可以通过变量的值设置为null来清空变量，此时变量的值为null。声明一个变量赋值后，再次声明该变量，其值不会消失。

<span style="font-size:10px;">var name="Gates", age=56, job="CEO";//声明多个变量var carname;//此时carname的值为undefinedvar name="Volvo";var name;//此时name的值依然是Volvo</span>

局部JavaScript变量和全局JavaScript变量:在JavaScript函数内部声明的变量(使用var)是局部变量，所以只能在函数内部访问它(该变量的作用域是局部的),所以可以在不同的函数中使用名称相同的局部变量，因为只有声明过该变量的函数才能识别出该变量，只要函数执行完毕，局部变量就会被删除。在函数外声明的变量是全局变量，网页上所有的脚本和函数都能访问它，全局变量会在页面关闭后删除，如果在函数中给尚未声明的变量赋值，那么该变量自动作为全局变量声明。

10、JavaScript数据类型：JavaScript拥有动态类型，即相同的变量可以作为不同的类型

<pre code_snippet_id="1832937" snippet_file_name="blog_20160816_5_6099007" name="code" class="javascript">var x                // x 为 undefinedvar x = 6;           // x 为数字var x = "Bill";      // x 为字符串

(1)字符串String：当赋值字符串时，要用""或''包围这个值

(2)数字Number：不能用引号包围，可以带小数点，也可以不带，如果前缀没0，则JavaScript会把数值常量解释为八进制数，如果前缀为0x，则解释为十六进制数

①属性：MAX VALUE(最大值)、MIN VALUE(最小值)、NEGATIVE INFINITIVE(负无穷大)、POSITIVE INFINITIVE(正无穷大)、NaN(非数字值)、prototype、constructor

②方法：toExponential()、toFixed(num)(将Number四舍五入为指定小数位数的数字)、toPrecision()、toString()、valueOf()

③数字创建：

<pre name="code" class="java">var myNum=new Number(value);var myNum=Number(value);

(3)布尔：只有两个值：true和false

(4)数组：

①创建方式如下：

<pre name="code" class="java">var cars=new Array();cars[0]="Audi";cars[1]="BMW";cars[2]="Volvo";var cars=new Array("Audi","BMW","Volvo");var cars=["Audi","BMW","Volvo"];

②方法：concat():连接两个或更多的数组并返回结果

<pre name="code" class="java">var arr = new Array(3)arr[0] = "George"arr[1] = "John"arr[2] = "Thomas"var arr2 = new Array(3)arr2[0] = "James"arr2[1] = "Adrew"arr2[2] = "Martin"var arr3 = new Array(2)arr3[0] = "William"arr3[1] = "Franklin"document.write(arr.concat(arr2,arr3))

join():将数组中所有元素放入一个字符串中，可指定分隔符

<pre name="code" class="java">var arr = new Array(3);arr[0] = "George"arr[1] = "John"arr[2] = "Thomas"document.write(arr.join());//George,John,Thomasdocument.write("<br />");document.write(arr.join("."))//George.John.Thomas

pop():删除并返回数组的最后一个元素

reverse():颠倒数组中元素的顺序

shift():删除并返回数组的第一个元素

sort(sortby):对数组进行排序，可规定排序顺序，sortby必须是函数

function sortNumber(a,b){return a - b}var arr = new Array(6)arr[0] = "10"arr[1] = "5"arr[2] = "40"arr[3] = "25"arr[4] = "1000"arr[5] = "1"document.write(arr + "<br />")document.write(arr.sort(sortNumber))//<span style="font-family: Consolas, "Courier New", Courier, monospace; font-size: 10px; background-color: rgb(245, 245, 245);">1,5,10,25,40,1000,直接调用sort()结果为</span><span style="font-family: Consolas, "Courier New", Courier, monospace; font-size: 10px; background-color: rgb(245, 245, 245);">1,10,1000,25,40,5</span>

(5)对象：对象由{}分隔，在括号内部，对象的属性以名称和值对的形式来定义，属性由逗号分隔

<span style="font-size:10px;">var person={firstname:"Bill", lastname:"Gates", id:5566};</span>

对象属性的两种寻址方式：

<span style="font-size:10px;">name=person.lastname;name=person["lastname"];</span>

(6)日期：

①创建：var myDate=new Date();

②方法：Date():返回当日的日期和时间

getDate():从Date对象中返回一个月中的某一天(1-31)

getDay():从Date对象中返回一周中的某一天(0-6)

getMonth():从Date对象中返回月份

getFullYear():从Date对象中返回四位数字年份

getTime():返回自1970年1月1日至今的毫秒数

(7)Math

方法：abs(x):返回数的绝对值

ceil(x):对数进行上舍入

floor(x):对数进行下舍入

max(x,y):返回x、y中的最高值

min(x,y):返回x、y中的最低值

random():返回0-1的随机数

round():把数四舍五入为最接近的整数

11、JavaScript运算符：

(1)、算数运算符：

加(+)减(-)乘(*)除(/)求余数(%)累加(++,x=y++为x=y，然后y在累加，x=++y为x=累加后的y，递减同理)递减(--)

(2)、赋值运算符

等于(=)加等于(+=,x+=y为x=x+y,以下同理)减等于(-=)乘等于(*=)除等于(/=)模等于(%=)

(3)、比较运算符

等于(==,5和'5',类型不同，但==返回true)全等(值和类型)(===，5和'5'返回false)不等于(!=)大于(>)小于(<)大于等于(>=)小于等于(<=)

(4)、逻辑运算符

和(&&)或(||)非(!)

12、JavaScript语句：

(1)、if else语句：if(){}else if(){}else{}，只有当指定条件为true时该语句才会执行，大小写敏感，if要小写

(2)、switch语句：switch语句用于基于不同的条件来执行不同的动作

(3)、for循环语句：

(4)、for/in循环语句：遍历对象的属性

<span style="font-size:10px;">var person={fname:"John",lname:"Doe",age:25};for (x in person)  {  txt=txt + person[x];  }</span>

(5)、while和do/while循环语句

(6)、break语句用于跳出循环，只能用在循环和switch语句中，continue用于跳过循环中的一个迭代，只用用在循环中

(7)、标签，在需要标记的JavaScript语句之前加上冒号。

<span style="font-size:10px;">cars=["BMW","Volvo","Saab","Ford"];list:{document.write(cars[0] + "<br>");document.write(cars[1] + "<br>");document.write(cars[2] + "<br>");break list;document.write(cars[3] + "<br>");document.write(cars[4] + "<br>");document.write(cars[5] + "<br>");}</span>

(8)、异常语句try catch：

<span style="font-size:10px;"><!DOCTYPE html><html><head><script>var txt="";function message(){try  {  adddlert("Welcome guest!");  }catch(err)  {  txt="There was an error on this page.\n\n";  txt+="Error description: " + err.message + "\n\n";  txt+="Click OK to continue.\n\n";  alert(txt);  }}</script></head><body><input type="button" value="View message" onclick="message()"></body></html></span>

0 0