现在的位置: 网页制作教程网站制作教程 >正文
JavaScript脚本

JavaScript函数、对象与BOM-JavaScript学习笔记三

发表于2017/2/22 网站制作教程 0条评论 ⁄ 热度 847℃

JS函数:

和主流编程语言一样,JS中的函数是可以重复使用的代码块,可以由一个事件执行,也可以直接被调用。

函数是ECMAScript的核心。

JavaScript

(1)函数基本语法:

1、函数声明

function functionName(arg0,arg1,arg2......argN)
{
statements
};

其中,关键字function必须小写。

2、函数调用

只需要通过函数名加上对应参数即可。

functionName(arg0,arg1,arg2......argN);

3、函数返回值

函数的返回值无需明确声明,只需通过return返回值即可,若函数本身无值,也可通过调用没有参数的return退出函数。

function aMessage(str)
{
 if(str=="zero") {
 return;
 }
 alert(str);
};

上段代码中,若str等于"zero",则直接退出函数,不显示弹窗。

(2)arguments对象访问函数参数:

function hello(name,age)
{
alert("I am " + name + ",My old is " + age + " years!");
}

上述代码中,尽管函数调用时参数不全,但仍可正常运行。在JS中传入参数的个数可以少于定义函数时参数的个数。若在函数中使用了未定义的参数,会提示语法错误(参数未定义),若参数定义了但未正确传入,则参数会被undefined替换,不影响代码运行。

JS对象:

(1)在ECMA中,对象的定义是“属性的无序集合,每个属性存放一个原始值、对象或函数”。针对这个定义,书上有这样的解释:对象是无特定顺序的值的数组。

(2)对象由特性(attribute)构成,特性可以是原始值,也可以是引用值。若特性中存放的是函数,则它将被视为对象的方法(method),否则该特性被看做是对象的属性(property)。

(3)对象的声明与实例化

使用new关键字加上实例化的类的名字即可。

var oObject = new Object;
var oStringObject = new String;

JS可以使用简略的语句来创建对象和数组。

var box = new Object();
box.width = 100;
box.height = 200;
box.label = "newBox"

可简写为下例代码:

var box = {
box.width = 100;
box.height = 200;
box.label = "newBox"
}

结尾不需要添加分号。

(4)对象引用

ECMAScript中,不能直接访问对象本身,但可以访问对象的引用,每次创建对象后,存储在变量中的内容都是该对象的引用,而非对象本身。

(5)对象废除

JS中无需关系内存的分配,当对象不再被引用时,该对象即被废除。若要强制废除对象,只需将对象的所有引用均设置为null。一般情况下使用完的对象最好废除掉。

BOM基础:

关于BOM的概念,之前已经提到过了,这里不再重复。

(1)window对象

window对象是客户端JS的最高层对象之一,一般情况下只要浏览器窗口打开并遇到Body、Frameset、Frame等元素时就会自动建立window对象并实例化。window对象也可通过window.open()方法创建。

(2)JS常用函数

1、alert()函数:用于对用户的提示/警告信息。

2、confirm()函数:弹出消息对话框(包含OK按钮和Cancel按钮)。

confirm()语法:confirm(str);

confirm()返回值:Boolean值(OK对应true;Cancel对应false)。

3、prompt()函数:弹出消息对话框(包含OK按钮、Cancel按钮和文本输入框)。

prompt()语法:prompt(str1,str2);

prompt()参数:str1指显示在对话框中的文本,只读;str2指文本框中的内容,可以修改。

prompt()返回值:若单击的是OK按钮,则返回文本框中的内容。单击Cancel返回null。

(3)document对象

用于表现HTML文档当前窗体的内容,是window对象的一部分,可以通过window.document属性进行访问。

1、document对象属性:

body:可对元素进行直接访问,若文档定义了框架集,则引用最外层的。

cookie:设置或返回与当前文档相关的cookie。

domain:返回当前文档域名。

lastModified:返回文档的最后修改日期和时间。

referrer:返回载入当前文档的URL。

title:返回文档标题。

URL:返回文档的URL。

2、document对象方法:

close():关闭document.open()打开的输出流,并显示选定的数据。

getElementById():返回对拥有指定id的第一个对象的引用。

getElementsByName():返回带指定名称的对象集合。

getElementsByTagName_r():返回带指定标签名的对象集合。

open():打开一个流以获取document.write()/dicument.writeln()方法的输出。

write():向文档流写入HTML表达式或JS代码。

writeln():同write()方法,但在每个表达式后自动添加一个换行符。

(4)location对象

用于获取或设置窗体的URL,可用于解析URL。window.location对象用于获取当前页面的URL,并把浏览器重定向到新的页面。

1、location是window的属性,也是document对象的属性。

2、location共有8个属性,7个是当前窗体URL的一部分,另一个是href属性(代表当前窗体的URL)。所有属性均可读写,但只要href与hash的写操作有意义。如通过修改location.href以重定位到一个URL,修改location.hash以跳转到当前页面中的anchor(等)名的标记上(页面不重新加载)。

3、location属性与函数

hash属性:返回URL中#符号后的内容。

host属性:返回域名。

hostname属性:返回主域名。

href属性:返回当前文档的完整的URL或设置当前文档的URL。

pathname属性:返回URL中域名后的部分。

port属性:返回URL中的端口。

protocol属性:返回URL中的协议。

search属性:返回URL中的查询字符串。

assign()函数:设置当前文档的URL。

replace()函数:设置当前文档的URL,并在history对象的地址列表中删除此URL。

reload()函数:重新载入当前文档(从服务器端)。

toString()函数:返回location对象的href属性的当前值。

(5)navigator对象

window.navigator对象包含访问者浏览器的相关信息。其中userAgent属性返回浏览器版本等信息的字符串,cookieEnabled可以用于判断用户浏览器是否开启cookie。

判断cookie是否开启:

alert(navigator.cookieEnabled);

(6)screen对象

用于获取用户的屏幕信息。

screen对象属性:

1、availHeight属性:窗口可使用的屏幕高度(px)。

2、availWidth属性:窗口可以使用的屏幕宽度(px)。

3、colorDepth属性:用户浏览器表示的颜色位数(一般为32位)。

4、picelDepth属性:用户浏览器表示的颜色位数(一般为32位,IE不支持此属性)。

5、height属性:屏幕高度(px)。

6、width属性:屏幕宽度(px)。

  • 暂无评论