未来必然是Web的世界，学习WEB基础的最佳网站是W3School。
http://www.w3school.com.cn
http://www.w3schools.com
跟完一个名校的网络编程课程（例如：http://www.stanford.edu/~ouster/cgi-bin/cs142-fall10/index.php )不要觉得需要多于一学期时间，大学生是全职一学期选3-5门课，你业余时间一定可以跟上
2， window, document, element 的关系：
http://www.w3school.com.cn/htmldom/dom_obj_window.asp
Window 对象属性document 对 Document 对象的只读引用。请参阅 Document 对象。
history 对 History 对象的只读引用。请参数 History 对象。
self 返回对当前窗口的引用。等价于 Window 属性。
top 返回最顶层的先辈窗口。
window window 属性等价于 self 属性，它包含了对窗口自身的引用。
status 设置窗口状态栏的文本。
name 设置或返回窗口的名称。
Navigator 对 Navigator 对象的只读引用。请参数 Navigator 对象。
3， addEventListener
addEventListener() registers a single event listener on a single target.
The event target may be a single node in a document, the document itself, a window, or an XMLHttpRequest.
target.addEventListener(type, listener, useCapture Optional );
target.addEventListener(type, listener, useCaptureOptional [, aWantsUntrusted Non-standard ] ); // Mozilla only
type
A string representing the event type to listen for. event type： http://www.w3schools.com/tags/ref_eventattributes.asp
listener
The object that receives a notification when an event of the specified type occurs. This must be an object implementing the EventListener interface, or simply a JavaScript function.
useCapture Optional
If true, useCapture indicates that the user wishes to initiate capture. After initiating capture, all events of the specified type will be dispatched to the registered listener before being dispatched to any EventTargets beneath it in the DOM tree. Events which are bubbling upward through the tree will not trigger a listener designated to use capture. See DOM Level 3 Events for a detailed explanation. Note that this parameter is not optional in all browser versions. If not specified, useCapture is false.
4， label and button
<script for="mybttn" event="onclick" language="javascript">
window.alert("这是第一方式的调用");
</script>
<script language="javascript">
function myfunc1(){
//document.getElementById("labelkeypress").innerHTML = "buttonclick";
document.getElementById("labelkeypress").innerText = "buttonclick";
window.alert("这是第二方式的调用");
}
</script>
<button name="mybttn">这是第一方式的调用</button>
<label for="txtName" accesskey="n" >name:</label> <label for="txtName" accesskey="n" id="labelkeypress" name="labelname" >123 </label>
<br>
<button name="mybttn2" οnclick="myfunc1();">这是第二方式的调用</button>
5， try catch
<head>
<script language="javascript">
function buttonclick() {
try
{
var x=document.getElementById("myframe");
var messa="Main keypress x==" + x + " x.contentWindow." + x.contentWindow +" x.contentWindow.addEventListener=" + x.contentWindow.addEventListener;
document.getElementById("labelkeypress").innerHTML = messa;
//document.getElementById("labelkeypress").innerText = "buttonclick";
window.alert("buttonclick");
}
catch(e)
{
alert("Iframe info error: " + e);
}
}
</script>
</head>
body onLoad="OnLoad();" onUnload="OnUnload();" οnkeydοwn="onmainbodykeydown();" οnclick="bodybuttonclick();" bgcolor=#ffffff text=#000000>
<label for="" accesskey="n" >event type:</label> <label for="" accesskey="n" id="labelkeypress" name="labelname" >null </label>
<br>
<br>
<label for="" accesskey="n" >log:</label> <label for="" accesskey="n" id="labellog" name="labelname" >null </label>
<br>
<button name="changelabel" size="30" οnclick="buttonclick();" οnmοusemοve="onmousemove();" οnkeydοwn="onkeydown();">changelabel</button>
<br>
<iframe οnlοad="myifrmaeload()" id="myframe" src="http://www.google.com" width="300" height="300" frameborder="5" scrolling="yes" />
</body>
6 事件属性窗口事件 (Window Events) 仅在 body 和 frameset 元素中有效。经测试在iframe 中有效。
属性 值 描述
onload 脚本 当文档被载入时执行脚本
onunload 脚本 当文档被卸下时执行脚本
表单元素事件 (Form Element Events) 仅在表单元素中有效。
属性 值 描述
onchange 脚本 当元素改变时执行脚本
onsubmit 脚本 当表单被提交时执行脚本
onreset 脚本 当表单被重置时执行脚本
onselect 脚本 当元素被选取时执行脚本
onblur 脚本 当元素失去焦点时执行脚本
onfocus 脚本 当元素获得焦点时执行脚本
图像事件 (Image Events) 该属性可用于 img 元素：
属性 值 描述
onabort 脚本 当图像加载中断时执行脚本
键盘事件 (Keyboard Events)
在下列元素中无效：base、bdo、br、frame、frameset、head、html、iframe、meta、param、script、style 以及 title 元素。
属性 值 描述
onkeydown 脚本 当键盘被按下时执行脚本
onkeypress 脚本 当键盘被按下后又松开时执行脚本
onkeyup 脚本 当键盘被松开时执行脚本
鼠标事件 (Mouse Events)
在下列元素中无效：base、bdo、br、frame、frameset、head、html、iframe、meta、param、script、style 以及 title 元素。
属性 值 描述
onclick 脚本 当鼠标被单击时执行脚本
ondblclick 脚本 当鼠标被双击时执行脚本
onmousedown 脚本 当鼠标按钮被按下时执行脚本
onmousemove 脚本 当鼠标指针移动时执行脚本
onmouseout 脚本 当鼠标指针移出某元素时执行脚本
onmouseover 脚本 当鼠标指针悬停于某元素之上时执行脚本
onmouseup 脚本 当鼠标按钮被松开时执行脚本
例如：
body onLoad="OnLoad();" onUnload="OnUnload();" οnkeydοwn="onmainbodykeydown();" οnclick="bodybuttonclick();" bgcolor=#ffffff text=#000000>
7, cross domain problem:
Permission denied for <file://> to get property window.addEventListener from <http://svtplay.se>.
You are running into a security problem. You cannot access a window object originating from a different domain. There is no resolution as far as I know.
You cannot have JavaScript loaded by a document on host A access or modify content in a document loaded from host B. Since one of your hosts is localhost:80 and the other is localhost:8080, these are considered to be different hosts by the browser.
例如：
window.addEventListener('load', function delayTilLoad()
{
var frames = window.frames; // or // var frames = window.parent.frames;
for (var i = 0; i < frames.length; i++) {
// do something with each subframe as frames[i]
frames[i].document.body.style.background = "red";
}
}, true);
I get Permission denied to get property Window.document
answer:
https://bugzilla.mozilla.org/show_bug.cgi?id=397828
addEventListener不属于JavaScript的内容，这是浏览器对象的方法，不同浏览器是不同的
https://bugzilla.mozilla.org/show_bug.cgi?id=397828
8 请问javascript : window、document 对象区别和联系?
[window对象]
它是一个顶层对象,而不是另一个对象的属性，即浏览器的窗口。
属性
defaultStatus 缺省的状态条消息
document 当前显示的文档(该属性本身也是一个对象)
frame 窗口里的一个框架((FRAME>)(该属性本身也是一个对象)
frames array 列举窗口的框架对象的数组,按照这些对象在文档中出现的顺序列出(该属性本身也是一个对象)
history 窗口的历史列表(该属性本身也是一个对象)
length 窗口内的框架数
location 窗口所显示文档的完整(绝对)URL不要把它与如document.location
混淆,后者是当前显示文档的URL。用户可以改变window.location(用另一个文档取代当前文档),但却不能改变
document.location (因为这是当前显示文档的位置)
name 窗口打开时,赋予该窗口的名字
opener 代表使用window.open打开当前窗口的脚本所在的窗口
parent 包含当前框架的窗口的同义词frame和window对象的一个属性
self 当前窗口或框架的同义词
status 状态条中的消息
top 包含当前框架的最顶层浏览器窗口的同义词
window 当前窗口或框架的同义词,与self相同方法
alert() 打开一个Alert消息框
clearTimeout() 用来终止setTimeout方法的工作
close() 关闭窗口
confirm() 打开一个Confirm消息框,用户可以选择OK或Cancel,如果用户单击OK,该方法返回true,单击
Cancel返回false
blur() 把焦点从指定窗口移开(这是Netscape Navigator 3.0 beta 3引入的新方法)
focus() 把指定的窗口带到前台(另一个新方法)
open() 打开一个新窗口
prompt() 打开一个Prompt对话框,用户可向该框键入文本,并把键入的文本返回到脚本
setTimeout() 等待一段指定的毫秒数时间,然后运行指令事件处理程序事件处理程序
Onload() 页面载入时触发
Onunload() 页面关闭时触发
[document对象]
该对象是window和frames对象的一个属性,是显示于窗口或框架内的一个文档
属性
alinkColor 活动链接的颜色(ALINK)
anchors array 列出文档锚点对象的数组(<A NAME=>)(该属性本身也是一个对象)
bgColor 文档的背景颜色(BGCOLOR)
cookie 存储于cookie.txt文件内的一段信息,它是该文档对象的一个属性
fgColor 文档的文本颜色(<BODY>标记里的TEXT特性)
form 文档中的一个窗体(<FORM>)(该属性本身也是一个对象)
forms anay 按照其出现在文档中的顺序列出窗体对象的一个数组(该属性本身也是一个对象)
lastModified 文档最后的修改日期
linkColor 文档的链接的颜色,即<BODY>标记中的LINK特性(链接到用户没有观察到的文档)
link 文档中的一个<A HREF=>标记(该属性本身也是一个对象)
links array 文档中link对象的一个数组,按照它们出现在文档中的顺序排列(该属性本身也是一个象)
location 当前显示文档的URL。用户不能改变document.location(因为这是当前显示文档的位置)。但是,可以改变 window.location (用其它文档取代当前文档)window.location本身也是一个对象,而
document.location不是对象
referrer 包含链接的文档的URL,用户单击该链接可到达当前文档
title 文档的标题((TITLE>)
vlinkColor 指向用户已观察过的文档的链接文本颜色,即<BODY>标记的VLINK特性方法
clear 清除指定文档的内容
close 关闭文档流
open 打开文档流
write 把文本写入文档
writeln 把文本写入文档,并以换行符结尾
区别
1、window指窗体。document指页面。document是window的一个子对象
2、用户不能改变document.location(因为这是当前显示文档的位置)。但是,可以改window.location (用其它文档取代当前文档)window.location本身也是一个对象,而document.location不是对象
9 请问xml中，Document node 和document element的区别
第一个表示节点,第二个表示节点中的元素.如<book type="c">书</book>表示节点, book就是element
parentElement和parentNode的区别
有好多人一直不明白parentElement和parentNode的区别，网上说的也不是很清楚。
第一点parentElement是ie专用的,就是说在firefox(ff)浏览器里是不能使用的，一般情况parentNode可以取代parentElement的所有功能。
第二点就如名字所说，parentElement匹配的是parent为element的情况，而parentNode匹配的则是parent为node的情况。element是包含在node里的，它的nodeType是一，以上是我的猜测，下面是我做的测试。
window.οnlοad=function(){ alert(document.body.parentNode.parentNode) }
window.οnlοad=function(){ alert(document.body.parentElement.parentElement) }
理论上，应该返回"document"节点（node）,但是它不是element对象，因此前面的代码返回object,而后面的代码返回null。
ＩＥ有很多专用的东西啊，难怪我写的东西有时在ＦＦ下完全运行不了。大家还是少用IE专有的东西为妙，向标准化看齐，尽管不能完全做到表转化。
The HTML DOM Node Tree
The HTML DOM views an HTML document as a tree-structure. The tree structure is called a node-tree.
All nodes can be accessed through the tree. Their contents can be modified or deleted, and new elements can be created.
The node tree below shows the set of nodes, and the connections between them. The tree starts at the root node and branches out to the text nodes at the lowest level of the tree:
一、HTML DOM是一个树型的对象
二、每个node都包含该节点的某些信息，分别是：
1. nodeName
nodeName 属性含有某个节点的名称。
元素节点的 nodeName 是标签名称属性节点的 nodeName 是属性名称文本节点的 nodeName 永远是 #text文档节点的 nodeName 永远是 #document注释：nodeName 所包含的 XML 元素的标签名称永远是大写的
2. nodeValue
对于文本节点，nodeValue 属性包含文本。
对于属性节点，nodeValue 属性包含属性值。
nodeValue 属性对于文档节点和元素节点是不可用的。
3. nodeType
nodeType 属性可返回节点的类型。
最重要的节点类型是：
10
636
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
