JavaScript学习

最新推荐文章于 2025-09-04 18:55:33 发布

weixin_30267785

最新推荐文章于 2025-09-04 18:55:33 发布

阅读量50

点赞数

CC 4.0 BY-SA版权

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/dorothychai/p/4311525.html

JavaScript：写入 HTML 输出:

document.write("<h1>This is a heading</h1>");

JavaScript：对事件作出反应:

<button type="button" οnclick="alert('Welcome!')">点击这里</button>

JavaScript：改变 HTML 内容:

x=document.getElementById("demo")  //查找元素
x.innerHTML="Hello JavaScript";    //改变内容

JavaScript：改变 HTML 图像:

改变 HTML <image> 的来源 (src):

element=document.getElementById('myimage') //查找元素
element.src="/i/eg_bulboff.gif"; //改变图像

JavaScript：改变 HTML 样式:

x=document.getElementById("demo")  //找到元素
x.style.color="#ff0000";           //改变样式

JavaScript：验证输入:

if isNaN(x) {alert("Not Numeric")};

<head> 或 <body> 中的 JavaScript

通常的做法是把函数放入 <head> 部分中，或者放在页面底部。这样就可以把它们安置到同一处位置，不会干扰页面的内容。

外部的 JavaScript

外部文件通常包含被多个网页使用的代码。外部 JavaScript 文件的文件扩展名是 .js。

如需使用外部文件，请在 <script> 标签的 "src" 属性中设置该 .js 文件：

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

重新声明 JavaScript 变量

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

var carname="Volvo";
var carname;

JavaScript 数组

创建名为 cars 的数组：

var cars=new Array();
cars[0]="Audi";
cars[1]="BMW";
cars[2]="Volvo";

或者 (condensed array):

var cars=new Array("Audi","BMW","Volvo");

或者 (literal array):

var cars=["Audi","BMW","Volvo"];

Undefined 和 Null

Undefined 这个值表示变量不含有值。

可以通过将变量的值设置为 null 来清空变量。

cars=null;
person=null;

声明变量类型

JavaScript 拥有动态类型。这意味着相同的变量可用作不同的类型:

var x= 123;

var x= ‘hello’;

可以使用关键词 "new" 来声明其类型

var x= new Number;

如果前缀为 0，则 JavaScript 会把数值常量解释为八进制数，如果前缀为 0 和 "x"，则解释为十六进制数。

提示：绝不要在数字前面写零，除非您需要进行八进制转换。

var y=0377;
var z=0xFF;

JavaScript 对象

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

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

例如:

var message="Hello World!";
var x=message.length;   // 对象属性

var x=message.toUpperCase();  //对象方法

定义对象

对象由花括号分隔。在括号内部，对象的属性以名称和值对的形式 (name : value) 来定义。

var person={firstname:"Bill", lastname:"Gates", id:5566};

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

name=person.lastname;
name=person["lastname"];

也可以如下定义:

person=new Object();
person.firstname="Bill";
person.lastname="Gates";
person.age=56;
person.eyecolor="blue";

对象构造器

function person(firstname,lastname,age,eyecolor) { this.firstname=firstname; this.lastname=lastname; this.age=age; this.eyecolor=eyecolor;

  function changeName(name)
  {
   this.lastname=name;
  }

}

myFather=new person("Bill","Gates",56,"blue");

JavaScript 函数

function functionname(argument1,argument2)
{
这里是要执行的代码
}

向未声明的 JavaScript 变量来分配值

如果您把值赋给尚未声明的变量，该变量将被自动作为全局变量声明。

这条语句：

carname="Volvo";

将声明一个全局变量 carname，即使它在函数内执行。

比较运算符

运算符	描述	例子
==	等于	x==8 为 false
===	全等（值和类型）	x===5 为 true；x==="5" 为 false
!=	不等于	x!=8 为 true
>	大于	x>8 为 false
<	小于	x<8 为 true
>=	大于或等于	x>=8 为 false
<=	小于或等于	x<=8 为 true

For/In 循环

循环遍历对象的属性

var person={fname:"John",lname:"Doe",age:25};

for (x in person)
  {
  txt=txt + person[x];
  }

输出:JohnDoe25

JavaScript 表单验证

<html> <head> <script type="text/javascript"> function validate_email(field,alerttxt) { with (field) { apos=value.indexOf("@") dotpos=value.lastIndexOf(".") if (apos<1||dotpos-apos<2) {alert(alerttxt);return false} else {return true} } } function validate_form(thisform) { with (thisform) { if (validate_email(email,"Not a valid e-mail address!")==false) {email.focus();return false} } } </script> </head> <body> <form action="submitpage.htm"οnsubmit="return validate_form(this);" method="post"> Email: <input type="text" name="email" size="30"> <input type="submit" value="Submit"> </form> </body> </html>