javascript基础

1、存在形式

1、文件形式

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

2、嵌入html

<script type='text/javascript'>alert('page');</script>

2、代码块的位置

　　<body>标签内的代码底部

3、变量和函数的声明

1、全局变量和局部变量

name ＝ 'alex'

var name ＝ 'alex'

2、基本函数和自执行函数

function Foo(arg){

console.log(arg);

}

(function (arg) {

alert(arg);

})('alex')

4、字符串常用方法和属性

obj.trim()

obj.charAt(index)

obj.substring(start,end)

obj.indexOf(char)

obj.length

5、数组

声明，如：

var array = Array() 或 var array = []

添加

obj.push(ele) 追加

obj.unshift(ele) 最前插入

obj.splice(index,0,'content') 指定索引插入

移除

obj.pop() 数组尾部获取

obj.shift() 数组头部获取

obj.splice(index,count) 数组指定位置后count个字符

切片

obj.slice(start,end)

合并

newArray ＝ obj1.concat(obj2)

翻转

obj.reverse()

字符串化

obj.join('_')

长度

obj.length

注意：字典是一种特殊的数组

6、循环

var a = '123456789';

for(var i=0;i<10;i++){

console.log(a[i]);

}<br>

for(var item in a){

console.log(a[item]);

}

8、函数：

(1)将脚本编写为函数，就可以避免页面载入时执行该脚本。

函数包含着一些代码，这些代码只能被事件激活，或者在函数被调用时才会执行。

你可以在页面中的任何位置调用脚本（如果函数嵌入一个外部的 .js 文件，那么甚至可以从其他的页面中调用）。

函数可以在页面任何地方定义。

案例：

<html>
　　<head>
　　    <script type="text/javascript">
　　        function  test(){
　　              alert("消息框");
　　            }
　　    </script>
　　</head>
　　<body>
　　       <from>
                 <input type=“button”  value=“click me”  onclick=“test()”>
　　       </form>
　　</body>
</html>

(2)、函数（代参函数，无参函数）

function test(var a,var b){

//有参函数

要执行的程序

}

function test(){

//无参函数

要执行的程序

}

(3)、javascript变量的生存周期：

当在函数内声明了一个变量后，就只能在该函数中访问该变量。当退出该函数后，这个变量会被撤销。这种变量称为本地变量。您可以在不同的函数中使用名称相同的本地变量，这是因为只有

声明过变量的函数能够识别其中的每个变量。

如果您在函数之外声明了一个变量，则页面上的所有函数都可以访问该变量。这些变量的生存期从声明它们之后开始，在页面关闭时结束。

就是我们经常所说的局部变量和全局变量。

10、事件：

1)事件是可以被javascript侦测到的行为。

网页中的每个元素都可以产生某些可以触发 JavaScript 函数的事件。比方说，我们可以在用户点击某按钮时产生一个 onClick 事件来触发某个函数。事件在 HTML 页面中定义。

事件举例：

· 鼠标点击

· 页面或图像载入

· 鼠标悬浮于页面的某个热点之上

· 在表单中选取输入框

· 确认表单

· 键盘按键

注意：事件通常与函数配合使用，当事件发生时函数才会执行

（2）常用事件案例。

案例1：onFouces,onBlur和onChange这三个事件通常相互配合来验证表单

下面是一个使用 onChange 事件的例子。用户一旦改变了域的内容，checkMail() 函数就会被调用

案例2：onSubmit用于提交表单之前验证表单域,

下面是一个使用 onSubmit 事件的例子。当用户单击表单中的确认按钮时，checkForm() 函数就会被调用。假若域的值无效，此次提交就会被取消。checkForm() 函数的返回值是 true 或

者 false。如果返回值为true，则提交表单，反之取消提交。

案例3：onMouseOver和onMouseOut：

onMouseOver 和 onMouseOut 用来创建“动态的”按钮

下面是一个使用 onMouseOver 事件的例子。当 onMouseOver 事件被脚本侦测到时，就会弹出一个警告框：

从 JavaScript 访问某个 HTML 元素，您可以使用 document.getElementById(id) 方法。

DOM选择器：

document.getElementById('id')
document.getElementsByName('name')
document.getElementsByTagName('tagname')

直接把 <p> 元素写到 HTML 文档输出中：

document.write("<p>我的第一个 JavaScript</p>");

document.getElementById("demo").innerHTML="你好 Dolly";

<html>

<body>

<p id="myPar">我是一个段落。</p>

<div id="myDiv">我是一个div。</div>

<p>

</p>

function myFunction() #function是函数

{

document.getElementById("myPar").innerHTML="你好世界";

document.getElementById("myDiv").innerHTML="你最近怎么样?";

}

</script>

<p>当您点击上面的按钮时，两个元素会改变。</p>

</body>

</html>

Value = undefined

在计算机程序中，经常会声明无值的变量。未使用值来声明的变量，其值实际上是 undefined。

在执行过以下语句后，变量 carname 的值将是 undefined：

var carname;

重新声明 JavaScript 变量

如果重新声明 JavaScript 变量，该变量的值不会丢失：

在以下两条语句执行后，变量 carname 的值依然是 "Volvo"：

var carname="Volvo";
var carname;

javascript数据类型

字符串（String）、数字(Number)、布尔(Boolean)、数组(Array) 类似python的列表、对象(Object)类似python的字典、空（Null）、未定义（Undefined）。

在 JavaScript 中，对象是拥有属性和方法的数据。

属性和方法

属性是与对象相关的值。

方法是能够在对象上执行的动作。

创建 JavaScript 对象

JavaScript 中的几乎所有事务都是对象：字符串、数字、数组、日期、函数，等等。

你也可以创建自己的对象。

本例创建名为 "person" 的对象，并为其添加了四个属性：

实例

person=new Object();
person.firstname="John";
person.lastname="Doe";
person.age=50;
person.eyecolor="blue";

访问对象的属性

访问对象属性的语法是：

objectName.propertyName

本例使用 String 对象的 length 属性来查找字符串的长度：

var message="Hello World!";
var x=message.length;

在以上代码执行后，x 的值是：

访问对象的方法

您可以通过下面的语法调用方法：

objectName.methodName()

这个例子使用 String 对象的 toUpperCase() 方法来把文本转换为大写：

var message="Hello world!";
var x=message.toUpperCase();

在以上代码执行后，x 的值是：

HELLO WORLD!

函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块。

JavaScript 函数语法

函数就是包裹在花括号中的代码块，前面使用了关键词 function：

function functionname()
{
执行代码
}

当调用该函数时，会执行函数内的代码。

可以在某事件发生时直接调用函数（比如当用户点击按钮时），并且可由 JavaScript 在任何位置进行调用。

	JavaScript 对大小写敏感。关键词 function 必须是小写的，并且必须以与函数名称相同的大小写来调用函数。

调用带参数的函数

在调用函数时，您可以向其传递值，这些值被称为参数。

这些参数可以在函数中使用。

您可以发送任意多的参数，由逗号 (,) 分隔：

myFunction(argument1,argument2)

当您声明函数时，请把参数作为变量来声明：

function myFunction("marked">var1,"marked">var2)
{
代码
}

变量和参数必须以一致的顺序出现。第一个变量就是第一个被传递的参数的给定的值，以此类推。

带有返回值的函数

有时，我们会希望函数将值返回调用它的地方。

通过使用 return 语句就可以实现。

在使用 return 语句时，函数会停止执行，并返回指定的值。

语法

function myFunction()
{
var x=5;
return x;
}

上面的函数会返回值 5。

注意：整个 JavaScript 并不会停止执行，仅仅是函数。JavaScript 将继续执行代码，从调用函数的地方。

函数调用将被返回值取代：

var myVar=myFunction();

myVar 变量的值是 5，也就是函数 "myFunction()" 所返回的值。

即使不把它保存为变量，您也可以使用返回值：

document.getElementById("demo").innerHTML=myFunction();

"demo" 元素的 innerHTML 将成为 5，也就是函数 "myFunction()" 所返回的值。

您可以使返回值基于传递到函数中的参数：

在您仅仅希望退出函数时，也可使用 return 语句。返回值是可选的：

function myFunction(a,b)
{
if (a>b)
{
"marked">return;
}
x=a+b
}

如果 a 大于 b，则上面的代码将退出函数，并不会计算 a 和 b 的总和。

If...else if...else 语句

使用 if....else if...else 语句来选择多个代码块之一来执行。

if (condition1)

{

当条件 1 为 true 时执行的代码

}
else if (condition2)
{
当条件 2 为 true 时执行的代码
}
else
{
当条件 1 和条件 2 都不为 true 时执行的代码
}

switch(n)
{
case 1:
执行代码块 1
break;
case 2:
执行代码块 2
break;
default:
n 与 case 1 和 case 2 不同时执行的代码
}

工作原理：首先设置表达式 n（通常是一个变量）。随后表达式的值会与结构中的每个 case 的值做比较。如果存在匹配，则与该 case 关联的代码块会被执行。请使用 break 来阻止代码自动地向下一个 case 运行。

JavaScript 循环

如果您希望一遍又一遍地运行相同的代码，并且每次的值都不同，那么使用循环是很方便的。

for (var i=0;i<cars.length;i++)
{
document.write(cars[i] + "<br>");
}

While 循环

While 循环会在指定条件为真时循环执行代码块。

do/while 循环是 while 循环的变体。该循环会执行一次代码块，在检查条件是否为真之前，然后如果条件为真的话，就会重复这个循环。

语法

do
{
需要执行的代码
}
while (条件);

break 语句可用于跳出循环。

break 语句跳出循环后，会继续执行该循环之后的代码（如果有的话）：

实例

for (i=0;i<10;i++)
{
if (i==3)
    {
    break;
    }
x=x + "The number is " + i + "<br>";
}

Continue 语句

continue 语句中断循环中的迭代，如果出现了指定的条件，然后继续循环中的下一个迭代。该例子跳过了值 3：

for (i=0;i<=10;i++)
{
if (i==3) continue;
x=x + "The number is " + i + "<br>";
}

javascript错误提示

try 语句测试代码块的错误。

catch 语句处理错误。

throw 语句创建自定义错误。

JavaScript 抛出（throw）错误

当错误发生时，当事情出问题时，JavaScript 引擎通常会停止，并生成一个错误消息。

描述这种情况的技术术语是：JavaScript 将抛出一个错误。

try 语句允许我们定义在执行时进行错误测试的代码块。

catch 语句允许我们定义当 try 代码块发生错误时，所执行的代码块。

JavaScript 语句 try 和 catch 是成对出现的。

try
{
//在这里运行代码
}
catch(err)
{
//在这里处理错误
}

Throw 语句

throw 语句允许我们创建自定义错误。

正确的技术术语是：创建或抛出异常（exception）。

如果把 throw 与 try 和 catch 一起使用，那么您能够控制程序流，并生成自定义的错误消息。

语法

throw exception

异常可以是 JavaScript 字符串、数字、逻辑值或对象。

实例

本例检测输入变量的值。如果值是错误的，会抛出一个异常（错误）。catch 会捕捉到这个错误，并显示一段自定义的错误消息：

实例

JavaScript 表单验证

JavaScript 可用来在数据被送往服务器前对 HTML 表单中的这些输入数据进行验证。

表单数据经常需要使用Javascript来验证其正确性：

验证表单数据是否为空?

验证输入是否是一个正确的email地址?

验证日期是否输入正确?

验证表单输入内容是否为数字型?

function validateForm()
{
var x=document.forms["myForm"]["fname"].value;
if (x==null || x=="")
{
alert("First name must be filled out");
return false;
}
}

posted @ 2015-12-03 11:27 muzinan110 阅读(147) 评论(0) 编辑收藏举报

会员力量，点亮园子希望

刷新页面返回顶部

muzinan110