6.21随笔

一、object对象

一、属性

Object自带一个prototype的属性,即Object.prototype,Object.prototype本身也是一个对象,也会有一些属性和方法。如下:

1、属性

Object.prototype.writable:默认为false

Object.prototype.enumerable:默认为false

Object.prototype.configurable:默认为false

Object.prototype.constructor:用于创建一个对象的原型。

2、常用方法

?

Object.prototype.hasOwnProperty():返回一个布尔值,表示某个对象是否含有指定的属性,而且此属性非原型链继承。

Object.prototype.isPrototypeOf():返回一个布尔值,表示指定的对象是否在本对象的原型链中。

Object.prototype.propertyIsEnumerable():判断指定属性是否可枚举。

Object.prototype.toString():返回对象的字符串表示。

Object.prototype.watch():给对象的某个属性增加监听。

Object.prototype.unwatch():移除对象某个属性的监听。

Object.prototype.valueOf():返回指定对象的原始值。

?

二、方法

Object.assign(target, …sources):把任意多个的源对象自身的可枚举属性拷贝给目标对象,然后返回目标对象。

Object.create(proto,[propertiesobject]):创建一个拥有指定原型和若干个指定属性的对象。

Object.defineProperties(obj, props):在一个对象上添加或修改一个或者多个自有属性,并返回该对象。

Object.defineProperty(obj, prop, descriptor):直接在一个对象上定义一个新属性,或者修改一个已经存在的属性, 并返回这个对象。obj:需要定义属性的对象。prop:需定义或修改的属性的名字。descriptor:将被定义或修改的属性的描述符。

Object.entries(obj):返回一个包含由给定对象所有可枚举属性的属性名和属性值组成的 [属性名,属性值] 键值对的数组,数组中键值对的排列顺序和使用for…in循环遍历该对象时返回的顺序一致。

举例:

var obj = { foo: “bar”, baz: 42 };

console.log(Object.entries(obj)); // [ [‘foo’, ‘bar’], [‘baz’, 42] ]

Object.freeze(obj):冻结一个对象,冻结指的是不能向这个对象添加新的属性,不能修改其已有属性的值,不能删除已有属性,以及不能修改该对象已有属性的可枚举性、可配置性、可写性。也就是说,这个对象永远是不可变的。该方法返回被冻结的对象。

Object.getOwnPropertyDescriptor(obj, prop):返回指定对象上一个自有属性对应的属性描述符。

Object.getOwnPropertyNames(obj):返回一个由指定对象的所有自身属性的属性名(包括不可枚举属性)组成的数组。

举例:

// 类数组对象

var obj = { 0: “a”, 1: “b”, 2: “c”};

console.log(Object.getOwnPropertyNames(obj).sort()); // [“0”, “1”, “2”]

Object.getPrototypeOf(object):返回该对象的原型。

Object.is(value1, value2):判断两个值是否是同一个值。

Object.isExtensible(obj):判断一个对象是否是可扩展的(是否可以在它上面添加新的属性)。

Object.isFrozen(obj):判断一个对象是否被冻结(frozen)。

Object.isSealed(obj):判断一个对象是否是密封的(sealed)。密封对象是指那些不可 扩展 的,且所有自身属性都不可配置的(non-configurable)且属性不可删除的对象(其可以是可写的)。

Object.keys(obj):返回一个由给定对象的所有可枚举自身属性的属性名组成的数组,数组中属性名的排列顺序和使用for-in循环遍历该对象时返回的顺序一致

举例:

var arr = [“a”, “b”, “c”];

alert(Object.keys(arr)); // 弹出”0,1,2”

// 类数组对象

var obj = { 0 : “a”, 1 : “b”, 2 : “c”};

alert(Object.keys(obj)); // 弹出”0,1,2”

Object.preventExtensions(obj):让一个对象变的不可扩展,也就是永远不能再添加新的属性。

Object.setPrototypeOf(obj, prototype):将一个指定的对象的原型设置为另一个对象或者null

Object.values(obj):返回一个包含指定对象所有的可枚举属性值的数组,数组中的值顺序和使用for…in循环遍历的顺序一样。

举例:

var obj = { foo: “bar”, baz: 42 };

console.log(Object.values(obj)); // [‘bar’, 42]

二、JSX

JSX简介

JSX就是Javascript和XML结合的一种格式。React发明了JSX,利用HTML语法来创建虚拟DOM。当遇到<,JSX就当HTML解析,遇到{就当JavaScript解析。

如下(JS写法)

var child1 = React.createElement(‘li‘, null, ‘First Text Content‘);

var child2 = React.createElement(‘li‘, null, ‘Second Text Content‘);

var root = React.createElement(‘ul‘, { className: ‘my-list‘ }, child1, child2);

等价于(JSX写法)

?

?

var root =(

<ul className="my-list">

<li>First Text Content</li>

<li>Second Text Content</li>

</ul>

);

?

?

后者将XML语法直接加入JS中,通过代码而非模板来高效的定义界面。之后JSX通过翻译器转换为纯JS再由浏览器执行。在实际开发中,JSX在产品打包阶段都已经编译成纯JavaScript,JSX的语法不会带来任何性能影响。另外,由于JSX只是一种语法,因此JavaScript的关键字class, for等也不能出现在XML中,而要如例子中所示,使用className, htmlFor代替,这和原生DOM在JavaScript中的创建也是一致的。JSX只是创建虚拟DOM的一种语法格式而已,除了用JSX,我们也可以用JS代码来创建虚拟DOM.

JSX语法介绍

大括号里是JavaScript,不要加引号,加引号就会被当成字符串。

三元表达式

JSX本身就和XML语法类似,可以定义属性以及子元素。唯一特殊的是可以用大括号来加入JavaScript表达式.例如:

var person = <Person name={window.isLoggedIn ? window.name : ‘‘} />;

上述代码经过JSX编译后会得到:

var person = React.createElement(

Person,

{name: window.isLoggedIn ? window.name : ‘‘}

);

数组递归

数组循环,数组的每个元素都返回一个React组件。

?

?

var lis = this.todoList.todos.map(function (todo) {

return (

<li>

<input type="checkbox" checked={todo.done}>

<span className={‘done-‘ + todo.done}>{todo.text}</span>

</li>

);

});

var ul = (

<ul className="unstyled">

{lis}

</ul>

);

?

?

JSX中绑定事件

JSX让事件直接绑定在元素上。

<button onClick={this.checkAndSubmit.bind(this)}>Submit</button>

和原生HTML定义事件的唯一区别就是JSX采用驼峰写法来描述事件名称,大括号中仍然是标准的JavaScript表达式,返回一个事件处理函数。

React并不会真正的绑定事件到每一个具体的元素上,而是采用事件代理的模式:在根节点document上为每种事件添加唯一的Listener,然后通过事件的target找到真实的触发元素。这样从触发元素到顶层节点之间的所有节点如果有绑定这个事件,React都会触发对应的事件处理函数。这就是所谓的React模拟事件系统。尽管整个事件系统由React管理,但是其API和使用方法与原生事件一致。

JSX中使用样式

在JSX中使用样式和真实的样式也很类似,通过style属性来定义,但和真实DOM不同的是,属性值不能是字符串而必须为对象。

例如:

<div style={{color: ‘#ff0000‘, fontSize: ‘14px‘}}>Hello World.</div>

或者

?

?

var style = {

color: ‘#ff0000‘,

fontSize: ‘14px‘

};

var node = <div style={style}>HelloWorld.</div>;

?

?

要明确记住,{}里面是JS代码,这里传进去的是标准的JS对象。在JSX中可以使用所有的的样式,基本上属性名的转换规范就是将其写成驼峰写法,例如“background-color”变为“backgroundColor”, “font-size”变为“fontSize”,这和标准的JavaScript操作DOM样式的API是一致的。

HTML转义

在组件内部添加html代码,并将html代码渲染到页面上。React默认会进行HTML的转义,避免XSS攻击,如果要不转义,可以这么写:

?

?

var content=‘<strong>content</strong>‘;

React.render(

<div dangerouslySetInnerHTML={{__html: content}}></div>,

document.body

);

?

?

三、eval

1. 和其他解释性语言一样,javascript 同样可以解释运行由javascript源代码组成的字符串,javascript 通过eval()来完成。

2. eval() 其实是一个函数,是javascript很早版本中就已经存在,但是javascript设计者和解释器对其进行了许多的限制,看起来eval更像一个运算符。但是作为用于动态执行代码,eval存在这样的问题,解释器无法对动态代码做进一步的优化。如果将它看做一个函数,那它是可以被赋予其他名字的:

var A = eval;

var B = A;

如果是这样的话,那么解释器就无法优化调用B()的函数了。因此设计者赋予eval一些运算符的特性(作为保留字)之后这些问题得到解决。

3. Eval 只有一个参数,如果传入的不是字符串的话,它直接返回这个参数;如果是字符串,那么首先会进行编译,如编译失败则爆出语法错误;编译成功则执行代码。更主要的是eval可以使用调用它的变量作用域环境,也就是说它查找的变量或者新增的变量作用域跟代码的完全一样。

如:

function A()

{

eval(‘var x ;‘);

eval("x=1"); //在一个函数中定义或者更改,那就是针对局部变量。

}

4. 全局eval

eval 可以动态执行代码,并申明或者改变变量,当然可以对全局变量进行上述操作。如

?

var globalEval = eval; //定义全局eval函数别名

var a =‘global‘, b = ‘global‘; //全局变量

function c()

{

var a = ‘local‘; //局部变量

eval(‘a+="changed"‘); //直接更改局部变量的值

return a; //返回更改后的局部变量

}

function d()

{

var b = ‘local‘;

globalEval("b+=‘changed‘");

return b;

}

console.log(c(), a); //localchanged global

console.log(d() , b) //local globalchanged更强的是,全局的eval还可以更改局部变量的能力,不过这也是javascript优化的一个大问题。 当然在严格模式下,eval更像一个运算符,不可以用别名来覆盖eval。

?

四、AJAX

什么是 AJAX ?

AJAX = 异步 JavaScript 和 XML。

AJAX 是一种用于创建快速动态网页的技术。

通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。

传统的网页(不使用 AJAX)如果需要更新内容,必需重载整个网页面。

有很多使用 AJAX 的应用程序案例:新浪微博、Google 地图、开心网等等。

AJAX 实例解释

上面的 AJAX 应用程序包含一个 div 和一个按钮。

div 部分用于显示来自服务器的信息。当按钮被点击时,它负责调用名为 loadXMLDoc() 的函数:

?

<html>

<body>

<div id="myDiv"><h3>Let AJAX change this text</h3></div>

<button type="button" onclick="loadXMLDoc()">Change Content</button>

</body>

</html>

?

接下来,在页面的 head 部分添加一个 <script> 标签。该标签中包含了这个 loadXMLDoc() 函数:

?

<head>

<script type="text/javascript">

function loadXMLDoc()

{

.... AJAX script goes here ...

}

</script>

</head>

?

Ajax的使用

以下步骤,如果不能理解你死记硬背都要记下来,总比你答不出来要好吧!

1.创建Ajax核心对象XMLHttpRequest

var xmlhttp;

if (window.XMLHttpRequest)

{// 兼容 IE7+, Firefox, Chrome, Opera, Safari

xmlhttp=new XMLHttpRequest();

}

else

{// 兼容 IE6, IE5

xmlhttp=newActiveXObject("Microsoft.XMLHTTP");

}

2.向服务器发送请求

xmlhttp.open(method,url,async);

send(string)

注意:open 的参数要牢记,很多面试官爱问这样的细节

method:请求的类型;GET 或 POST

url:文件在服务器上的位置

async:true(异步)或 false(同步)

send(string)方法post请求时才使用字符串参数,否则不用带参数。

注意:post请求一定要设置请求头的格式内容

xmlhttp.open("POST","ajax_test.html",true);

xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");

xmlhttp.send("fname=Henry&lname=Ford");

3.服务器响应处理

responseText 获得字符串形式的响应数据。

responseXML 获得XML 形式的响应数据。

3.1 同步处理

xmlhttp.open("GET","ajax_info.txt",false);

xmlhttp.send();

document.getElementById("myDiv").innerHTML=xmlhttp.responseText;

直接在send()后面处理返回来的数据。

3.2 异步处理

异步处理相对比较麻烦,要在请求状态改变事件中处理。

xmlhttp.onreadystatechange=function()

{

if (xmlhttp.readyState==4 &&xmlhttp.status==200)

{

document.getElementById("myDiv").innerHTML=xmlhttp.responseText;

}

}

一共有5中请求状态,从0 到 4 发生变化。

0: 请求未初始化

1: 服务器连接已建立

2: 请求已接收

3: 请求处理中

4: 请求已完成,且响应已就绪

xmlhttp.status:响应状态码。这个也是面试比较爱问的,这个必须知道4个以上,比较常见的有:

200: "OK"

403 (禁止) 服务器拒绝请求。

404 (未找到) 服务器找不到请求的网页。

408 (请求超时) 服务器等候请求时发生超时。

500 (服务器内部错误) 服务器遇到错误,无法完成请求

XMLHttpRequest 是 AJAX 的基础。

XMLHttpRequest 对象

所有现代浏览器均支持 XMLHttpRequest 对象(IE5 和 IE6 使用 ActiveXObject)。

XMLHttpRequest 用于在后台与服务器交换数据。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。

创建 XMLHttpRequest 对象

所有现代浏览器(IE7+、Firefox、Chrome、Safari 以及 Opera)均内建 XMLHttpRequest 对象。

创建 XMLHttpRequest 对象的语法:

variable=new XMLHttpRequest();

老版本的 Internet Explorer (IE5 和 IE6)使用 ActiveX 对象:

variable=new ActiveXObject("Microsoft.XMLHTTP");

为了应对所有的现代浏览器,包括 IE5 和 IE6,请检查浏览器是否支持 XMLHttpRequest 对象。如果支持,则创建 XMLHttpRequest 对象。如果不支持,则创建 ActiveXObject :

?

var xmlhttp;

if (window.XMLHttpRequest)

{// code for IE7+, Firefox, Chrome, Opera, Safari

xmlhttp=new XMLHttpRequest();

}

else

{// code for IE6, IE5

xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");

}

?

五、JS事件

事件是可以被 JavaScript 侦测到的行为。

事件

JavaScript 使我们有能力创建动态页面。事件是可以被 JavaScript 侦测到的行为。

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

事件举例:

鼠标点击

页面或图像载入

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

在表单中选取输入框

确认表单

键盘按键

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

onload 和 onUnload

当用户进入或离开页面时就会触发 onload 和 onUnload 事件。

onload 事件常用来检测访问者的浏览器类型和版本,然后根据这些信息载入特定版本的网页。

onload 和 onUnload 事件也常被用来处理用户进入或离开页面时所建立的 cookies。例如,当某用户第一次进入页面时,你可以使用消息框来询问用户的姓名。姓名会保存在 cookie 中。当用户再次进入这个页面时,你可以使用另一个消息框来和这个用户打招呼:"Welcome John Doe!"。

onFocus, onBlur 和 onChange

onFocus、onBlur 和 onChange 事件通常相互配合用来验证表单。

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

<input type="text" size="30" id="email" onchange="checkEmail()">

onSubmit

onSubmit 用于在提交表单之前验证所有的表单域。

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

<form method="post" action="xxx.htm" onsubmit="return checkForm()">

onMouseOver 和 onMouseOut

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

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

<a href="http://www.w3school.com.cn"

onmouseover="alert(‘An onMouseOver event‘);return false">

<img src="w3school.gif" width="100" height="30"> </a>

六、window对象属性和方法

window对象有以下方法:

open close alert confirm prompt setTimeout clearTimeout setInterval clearInterval moveBy moveTo resizeBy resizeTo scrollBy scrollTo find back forward home stop print blur focus captureEvent enableExternalCapture disableExternalCapture handleEvent  releaseEvent routeEvent scroll

1. open方法

语法格式:window.open(URL,窗口名称,窗口风格)

功能:打开一个新的窗口,并在窗口中装载指定URL地址的网页。

说明:

open方法用于打开一个新的浏览器窗口,并在新窗口中装入一个指定的URL地址;

open方法在打开一个新的浏览器窗口时,还可以指定窗口的名称(第二个参数);

open方法在打开一个新的浏览器窗口时,还可以指定窗口的风格(第三个参数),窗口风格有以下选项,这些选项可以多选,如果多选,各选项之间用逗号分隔:

toolbar:指定窗口是否有标准工具栏。当该选项的值为1或yes时,表示有标准工具栏,当该选项的值为0或no时,表示没有标准工具栏;

location:指定窗口是否有地址工具栏,选项的值及含义与toolbar相同;

directories:指定窗口是否有链接工具栏,选项的值及含义与toolbar相同;

status:指定窗口是否有状态栏,选项的值及含义与toolbar相同;

menubar:指定窗口是否有菜单,选项的值及含义与toolbar相同;

scrollbar:指定当前窗口文档大于窗口时是否有滚动条,选项的值及含义与toolbar相同;

resizable:指定窗口是否可改变大小,选项的值及含义与toolbar相同;

width:以像素为单位指定窗口的宽度,已被innerWidth取代;

height:以像素为单位指定窗口的高度,已被innerHeight取代;

outerWidth:以像素为单位指定窗口的外部宽度;

outerHeight:以像素为单位指定窗口的外部高度;

left:以像素为单位指定窗口距屏幕左边的位置;

top:以像素为单位指定窗口距屏幕顶端的位置;

alwaysLowered:指定窗口隐藏在所有窗口之后,选项的值及含义与toolbar相同;

alwaysRaised:指定窗口浮在所有窗口之上,选项的值及含义与toolbar相同;

dependent:指定打开的窗口为当前窗口的一个子窗口,并随着父窗口的关闭而关闭,选项的值及含义与toolbar相同;

hotkeys:在没有菜单栏的新窗口中设置安全退出的热键,选项的值及含义与toolbar相同;

innerHeight:设定窗口中文档的像素高度;

innerWidth:设定窗口中文档的像素宽度;

screenX:设定窗口距离屏幕左边界的像素长度;

screenY:设定窗口距离屏幕上边界的像素长度;

titleBar:指明标题栏是否在新窗口中可见,选项的值及含义与toolbar相同;

z-look:指明当窗口被激活时,不能浮在其它窗口之上,选项的值及含义与toolbar相同。

open方法返回的是该窗口的引用。

小技巧:该方法经常用于在打开一个网页时自动打开另一个窗口。

2. close方法

语法格式:window.close()

功能:close方法用于自动关闭浏览器窗口。

3. alert方法

语法格式: window.alert(提示字符串)

功能:弹出一个警告框,在警告框内显示提示字符串文本。

4. confirm方法

语法格式:window.confirm(提示字符串)

功能:显示一个确认框,在确认框内显示提示字符串,当用户单击“确定”按钮时该方法返回true,单击“取消”时返回false。

5. prompt方法

语法格式:window.prompt(提示字符串,缺省文本)

功能:显示一个输入框,在输入框内显示提示字符串,在输入文本框显示缺省文本,并等待用户输入,当用户单击“确定”按钮时,返回用户输入的字符串,当单击“取消”按钮时,返回null值。

6. setTimeout方法

语法格式:window.setTimeout(代码字符表达式,毫秒数)

功能:定时设置,当到了指定的毫秒数后,自动执行代码字符表达式。

7. clearTimeout方法

语法格式:window.clearTimeout(定时器)

功能:取消以前的定时设置,其中的参数是用setTimeout设置时的返回值。

8. setInterval方法

语法格式:window.setInterval(代码字符表达式,毫秒数)

功能:设定一个时间间隔后(第二个参数),反复执行“代码字符表达式”的内容

9. clearInterval方法

语法格式:window.clearInterval(时间间隔器)

功能:取消setInterval设置的定时。其中的参数是setInterval方法的返回值。

10. moveBy方法

语法格式:window.moveBy(水平位移量,垂直位移量)

功能:按照给定像素参数移动指定窗口。第一个参数是窗口水平移动的像素,第二个参数是窗口垂直移动的像素。

11.moveTo方法

语法格式:window.moveTo(x,y)

功能:将窗口移动到指定的指定坐标(x,y)处。

12. resizeBy方法

语法格式:window.resizeBy(水平,垂直)

功能:将当前窗口改变指定的大小(x,y),当x、y的值大于0时为扩大,小于0时为缩小。

13. resizeTo方法

语法格式:window.resizeTo(水平宽度,垂直宽度)

功能:将当前窗口改变成(x,y)大小,x、y分别为宽度和高度。

14. scrollBy方法

语法格式:window.scrollBy(水平位移量,垂直位移量)

功能:将窗口中的内容按给定的位移量滚动。参数为正数时,正向滚动,否则反向滚动。

15. scrollTo方法

语法格式:window.scrollTo(x,y)

功能:将窗口中的内容滚动到指定位置。

16.find方法

语法格式:window.find()

功能:当触发该方法时,将弹出一个“find”(查找)对话窗口,并允许用户在触发find方法的页面中查找一个字符串。

注:该属性在IE5.5及Netscape6.0中都不支持。

17. back方法

语法格式:window.back()

功能:模拟用户点击浏览器上的“后退”按钮,将页面转到浏览器的上一页。

说明:仅当当前页面存在上一页时才能进行该操作。

注:IE5.5不支持该方法,Netscape6.0支持。

18. forward方法

语法格式:window.forward()

功能:模拟用户点击浏览器上的“前进”按钮,将页面转到浏览器的下一页。

说明:仅当当前页面存在下一页时才能进行该操作。

注:IE5.5不支持该方法,Netscape6.0支持。

19. home方法

语法格式:window.home()

功能:模拟用户点击浏览器上的“主页”按钮,将页面转到指定的页面上。

注:IE5.5不支持该方法,Netscape6.0支持。

20. stop方法

语法格式:window.stop()

功能:模拟用户点击浏览器上的“停止”按钮,终止浏览器的下载操作。

注:IE5.5不支持该方法,Netscape6.0支持。

21. print方法

语法格式:window.print()

功能:模拟用户点击浏览器上的“打印”按钮,通知浏览器打开打印对话框打印当前页。

22. blur方法

语法格式:window.blur()

功能:从窗口中移出焦点。当与focus方法合用时必须小心,因为可能导致焦点不断移进移出。

23. focus方法

语法格式:window.focus()

功能:使窗口中得到焦点。当与blur方法合用时必须小心,因为可能导致焦点不断移进移出

24. captureevent方法

语法格式:window.captureevent(event)

window.captureevent(事件1|事件2|…|事件n)

功能:捕捉指定参数的所有事件。由于能够捕获哪些由本地程序自己处理的事件,所以程序员可以随意定义函数来处理事件。如果有多个事件需要捕捉,各事件之间用管道符“|”隔开。可捕捉的事件类型如下:

event.abort event.blur event.change event.click event.dblclick event.dragdrop event.error event.focus event.keydown event.keypress event.keyup event.load event.mousedown event.mousuemove event.mouseout event.mouseover event.mouseup event.move event.reset event.resize  event.select event.submit event.unload

25. enableexternalcapture事件

语法格式:window.enableexternalcapture(event)

功能:enableexternalcapture方法用于捕捉通过参数传入的外部事件。

26. disableexternalcapture事件

语法格式:window.disableexternalcapture()

功能:取消enableexternalcapture方法的设置,终止对外部事件的捕捉。

27. handleevent事件

语法格式:window.handleevent(event)

功能:触发指定事件的事件处理器。

28. releaseevent事件

语法格式:window.releaseevent(event)

window.releaseevent(事件1|事件2|…|事件n)

功能:释放通过参数传入的已被捕捉的事件,这些事件是由window.captureevent方法设置的,可释放的事件与captureevent相同。

29. routeevent事件

语法格式:window.releaseevent(event)

功能:把被捕捉类型的所有事件转交给标准事件处理方法进行处理,可转交的事件与captureevent相同。

30. scroll事件

语法格式:window.scroll(x坐标,y坐标)

功能:将窗口移动到指定的坐标位置。

window对象的属性

window对象具有如下属性:

status statusbar statusbar.visible defaultstatus location locationbar locationbar.visible self name closed frames frames.length length document history innerheight innerwidth menubar menubar.visible opener outerheight outerwidth pagexoffset pageyoffset parent  personalbar  personalbar.visible scrollbar scrollbar.visible toolbar toolbar.visible top 

1. status属性

语法格式:window.status=字符串

功能:设置或给出浏览器窗口中状态栏的当前显示信息。

小技巧:可以使用该属性设置浏览器窗口状态栏信息。

2. statusbar属性

语法格式:window.statusbar.属性

功能:statusbar属性本身也是一个对象,用于访问它自已的visible属性从而确定状态栏是否可见。

注:ie5.5浏览器不支持该属性。

3. statusbar.visible属性

语法格式: window.statusbar.visible

功能:检查状态栏是否可见,如果可见则返回true,反之返回false。

注:ie5.5浏览器不支持该属性。

4. defaultstatus属性

语法格式:window.defaultstatus[=字符串]

功能:defaultstatus属性值是浏览器窗中状态栏的默认显示信息

5.location属性

语法格式:window.location=url

功能:给出当前窗口的url信息或指定打开窗口的url。

6. locationbar属性

语法格式:window.locationbar.属性

功能:locationbar属性也可以看成是一个子对象,这个属性用来获取它自已的visible属性来确定位置栏是否可见。 到目前为止,该属性只有一个子属性:visible。

注:ie5.5不支持该属性。

7. locationbar.visible属性

语法格式:window.locationbar.visible

功能:返回位置栏是否可见,如果可见返回true,反之返回false。

注:ie5.5不支持该属性。

8. self属性

语法格式:window.self.方法

window.self.属性

功能:该属性包含当前窗口的标志,利用这个属性,可以保证在多个窗口被打开的情况下,正确调用当前窗口内的函数或属性而不会发生混乱。

9. name属性

语法格式: window.name=名称

功能:返回窗口名称,这个名称是由window.open()方法创建新窗口时给定的。在javascript1.0版本中,这个属性只能用于读取窗口名称,而到了javascript1.1版本时,可以用这个属性给一个不是用window.open()方法创建的窗口指定一个名称。

10. closed属性

语法格式:window.closed

功能:closed属性用于返回指定窗口的实例是否已经关闭,如果关闭,返回true ,反之返回flase。

11. frames属性

语法格式:window.frames[“框架名称”]

window.frames[数值]

功能:frames属性是一个数组,用来存储文档中每一个由元素创建的子窗口(框架)实例,其中的下标即可以是次序号也可以是用frame元素的name属性指定的名称来得到并使用。

12. frames.length属性

语法格式: window.frames.length

功能:frames.length属性用于给出文档中子窗口(框架)实例的个数。

13. length属性

语法格式:window.length

功能:length属性返回一个窗口内的子窗口数目,该属性与window.frame.length属性的值相同。

14. document属性

语法格式:window.document.事件 window.document.方法 window.document.属性

功能:window对象的子对象document是javascript的核心对象,在脚本中遇到body元素时创建一个实例。

15. history属性

语法格式: window.history[数值]  window.history.方法()  window.history.属性

window对象的子对象history是javascript的核心对象之一,该属性包含了一个已访问过页面的名称和url的数组。

16. innerheight属性

语法格式:window.innerheight=数值

功能:返回或指定浏览器窗口中文档的像素高度,这个高度不包括任何工具栏和组成窗口的页面修饰高度。

注:ie5.5不支持该属性。

17. innerwidth属性

语法格式:window.innerheight=数值

功能:返回或指定浏览器窗口中文档的像素宽度,这个宽度不包括任何工具栏和组成窗口的页面修饰宽度。

注:ie5.5不支持该属性。

18. menubar属性

语法格式:window.menubar.属性

功能:menubar属性也可以看成是一个子对象,这个属性用来获取它自已的visible属性来确定菜单栏是否可见。到目前为止,该属性只有一个子属性:visible。

注:ie5.5不支持该属性。

19. menubar.visible属性

语法格式:window.menubar.visible

功能:menubar.visible属性用于返回菜单栏是否可见,如果可见返回true,反之返回false。

注:ie5.5不支持该属性。

20. opener属性

语法格式:window.opener window.opener.方法 window.opener.属性

功能:opener属性与打开该窗口的父窗口相联系,当访问子窗口中operer属性时,返回的是父窗口。通过该属性,可以使用父窗口对象中的方法和属性。

21. outerheight属性

语法格式:window.outerheight

功能:outerheight属性用于访问浏览器窗口的像素高度,该高度包括工具栏和装饰边的高度。

注:ie5.5不支持该属性。

22. outerwidth属性

语法格式:window.outerwidth

功能:outerwidth属性用于访问浏览器窗口的像素宽度,该宽度包括工具栏和装饰边的宽度。

注:ie5.5不支持该属性。

23. pagexoffset属性

语法格式:window.pagexoffset=数值

功能:指定浏览器窗口中文档左上角在窗口中的当前水平像素位置。在利用moveto移动之前,可以通过该属性来决定是否需要移动窗口。因为该属性返回了可见文档相对整个页面的当前位置。

注:ie5.5不支持该属性。

24. pageyoffset属性

语法格式:window.pageyoffset=数值

功能:指定浏览器窗口中文档左上角在窗口中的当前垂直像素位置。在利用moveto移动之前,可以通过该属性来决定是否需要移动窗口。因为该属性返回了可见文档相对整个页面的当前位置。

注:ie5.5不支持该属性。

25. parent属性

语法格式:window.parent.frames[数值] window.parent.framesname

功能:访问各个子窗口(多框架)所在的父窗口。

26. personalbar属性

语法格式:window.personalbar.属性

功能:personalbar属性本身也是一个对象,用于访问其自身的visible属性来确定个人栏是否可见。

注:ie5.5不支持该属性。

27. personalbar.visible属性

语法格式:window.personalbar.visible

功能:确定个人栏是否可见,如果可见则返回true,反之返回false。

注:ie5.5不支持该属性。

28. scrollbars属性

语法格式:window.scrollbars.属性

功能:scrollbars属性本身也是一个对象,用于访问其自身的visible属性来确定滚动栏是否可见

注:ie5.5不支持该属性。

29. scrollbars.visible属性

语法格式:window.scrollbars.visible

功能:scrollbars.visible用于确定滚动栏是否可见,如果可见则返回true,反之返回false。

注:ie5.5不支持该属性。

30. toolbar属性

语法格式:window.toolbar.属性

功能:toolbar属性本身也是一个对象,用于访问它自已的visible属性从而确定工具栏是否可见。

注:ie5.5不支持该属性。

31. toolbar.visible属性

语法格式:window.toolbar.visible

功能:toolbar.visible属性用于检查工具栏是否可见,如果可见则返回true,反之返回false。

注:ie5.5不支持该属性。

32. top属性

语法格式:window.top.frames[数值]  window.top.framename  window.top.方法()

window.top.属性

功能:window对象的top属性用于包含所有装入浏览器的子窗口(多框架)的最顶层窗口的信息。

时间: 2024-11-10 01:14:52

6.21随笔的相关文章

2015.1.21学习笔记和心得!

2015.1.21 随笔: 指令:cp -v 显示复制过程 sort 按次序显示文件 whereis 查找命令 ln -s src dest 连接文件 dest -> src /etc/apt/sources.list //存放镜像的地址 /var/lib/lists/* // 存放索引文件的地址 /var/cache/apt/archives //下载的软件包缓存的地址 编写shell脚本:三步走 1.创建shell脚本,vim shell.sh 2.修改权限,增加执行权限 chmod 777

一周随笔--15.9.21

一周新知识点记录(15.9.21) 一. writeToFile:atomically: - (BOOL)writeToFile:(NSString *)path atomically:(BOOL)useAuxiliaryFile; 第二个参数的意思是: 如果为YES则保证文件的写入原子性,就是说会先创建一个临时文件,直到文件内容写入成功再导入到目标文件里. 如果为NO,则直接写入目标文件里. 二.  NSerror 参数依次为: 1.错误域(NSString) 2.错误标识 (NSIntege

【普通の随笔】4.21

随着期中考的过去,竞赛准备也进入了最后的倒计时了... 可蒟蒻还在复习..不对是学数据结构... 哦不... 想想庄神已经因为STOI停课两星期了...刷题无数... 可金中的环境,连Greens去参加NOI也只能停课一星期... 看来只能好好利用晚自修的时间了呢... 这个星期赶紧把数据结构最难最难的部分解决掉吧!!!!!!! 已无药可救... 决定把中午的休闲时间也废弃掉吧!!!!!! 也不知自己 能不能 坚持 下去 嗯 一鼓作气实现自己的梦想!!!!!!!!!!!!!!!!!!!!!!!!

2014年9月21日_随笔

(1)老妈十一要回老家,才突然发现买票好难啊.有亲朋很重要 (2)这周我做了什么.jdic,ETL,groovy,Nutz好多东西想学. (3)想改变,却发现这么久,还是在原地踏步. (4)人的性质真是很不相同啊.看贝儿很快就会去拉客来买东西,杨阳洋就羞涩些.生活中每个人处理问题的方式各不相同也是他们性质不同.找到最适合自己的.多尝试.不要害怕跌倒.即使曾经害怕了,现在也要说再试试. (5)最近一年发现自己越来越谨小慎微.害怕什么呢? (6)世界太大知识太多时间有限,该放弃的要放弃...

考研随笔&#183;2014/7/21

class Weather{ // 天气情况 bool isWet; // 天气是否潮湿 bool isHot; // 天气是否炎热 public Weather(bool isWet, bool isHot) { this.isWet = isWet; this.isHot = isHot; } } class Action{ // 行动 bool isGetUpEarly; // 是否早起 bool isGoHomeLate; // 是否晚回 public Action(bool isGet

yii2框架随笔21

今天来看一下BaseYii.php <?php /** * @link http://www.yiiframework.com/ * @copyright Copyright (c) 2008 Yii Software LLC * @license http://www.yiiframework.com/license/ */ namespace yii; use yii\base\InvalidConfigException; use yii\base\InvalidParamExceptio

XE3随笔21:系统默认语言与系统支持的语言列表

unit Unit1; interface uses   Windows, Messages, SysUtils, Variants, Classes, Graphics, Controls, Forms,   Dialogs, StdCtrls; type   TForm1 = class(TForm)     Memo1: TMemo;     Button1: TButton;     Button2: TButton;     Button3: TButton;     Button4:

随笔21 DBMS

DBMS:数据库管理系统(Database Management System)是一种操纵和管理数据库的大型软件,用于建立.使用和维护数据库,简称DBMS. DBMS对数据库的保护通过4个方面来实现: 数据库的恢复 数据库的并发控制 数据库的完整性控制 数据库安全性控制 DBMS中事务有四个特性,持久性,一致性,原子性,隔离性. 持久性实现恢复管理子系统: 一致性实现并发控制子系统: 原子性实现完整性管理子系统: 隔离性实现安全控制管理子系统

Web--js高级--12月21日随笔

问题: 在拖拽元素的时候,如果元素的内部加了文字或者图片,拖拽效果会失灵? 因为浏览器会给文字和图片一个默认行为,当文字和图片被选中的时候,会有一个拖拽的效果,即使我们没有人为他添加.所以当我们点击这个元素拖拽时,有可能选中文字或图片,触发浏览器天生给的那个行为,从而导致我们写的那个拖拽效果失灵. obj.onmousedown=function(ev){ var ev=ev||window.event; var _this=this; var x=ev.clientX-this.offsetL