// version 1.0.0 create 2017-05-22
/**
* JavaScript 运算符
*/
// instanceof
var box = {
color: "red"
};
box instanceof Array; // false
var box = [1, 2];
box instanceof Array; // true
/**
* JavaScript 函数
*/
// 用变量初始化函数
var box = function(num1, num2) {
return num1 + num2;
};
box(1, 2); // 3
// 函数可以传递函数
function mySum(num) {
return 10 + num;
}
function box(mySum, num) {
return mySum(num);
}
box(mySum, 10); // 20
// 函数递归 arguments.callee()
function box(num) {
if (num == 1) {
return 1;
} else {
return num * arguments.callee(num - 1);
}
}
box(5); // 120
// apply()
function box(name, age) {
return name + age;
}
function sum(name, age) {
// this表示window作用域
// []表示传递的参数 可以用arguments代替
// box.apply(this, [name, age]) 等价于 box.apply(this, arguments)
return box.apply(this, [name, age]);
}
// box.length 表示函数接收的参数个数
box.length; // 2
sum("test", 18); // "test18"
// call()
function box(name, age) {
return name + age;
}
function sum(name, age) {
return box.call(this, name, age);
}
sum("test", 18); // "test18"
var color = "红色";
var box = {
color: "蓝色"
};
function sayColor() {
return this.color;
}
sayColor.call(window); // "红色"
sayColor.call(box); // "蓝色"
/**
* JavaScript 变量
*/
// 全局变量 也是window的属性
var color = 'red';
this.color; // "red"
window.color; // "red"
window.color = 'green';
this.color; // "green"
color; // "green"
// 局部变量
var box = {
color: 'blue',
getColor: function() {
// this是box对象
return this.color;
}
};
box.color; // "blue"
box.getColor(); // "blue"
window.color; // "green"
window.box.color; // "blue"
// this是window对象
this.color; // "green"
this.box.getColor(); // "blue"
/**
* JavaScript 作用域
*/
function box() {
var outer = "box内全局作用域";
(function() {
// 自我执行的匿名函数 私有作用域
var inner = "box内局部作用域";
console.log("in outer: " + outer); // in outer: box内全局作用域
console.log("in inner: " + inner); // in inner: box内局部作用域
})();
console.log("out outer: " + outer); // out outer: box内全局作用域
console.log("out inner: " + inner); // Uncaught ReferenceError: inner is not defined
}
box();
function Box() {
// Box 私有变量
var age = 100;
// Box 私有函数
function run() {
return "运行中";
}
// Box 对外可见的公有接口
this.publicFun = function() {
return age + run();
}
}
var box = new Box();
box; // Box {publicFun: function(), __proto__: Object}
box.publicFun(); // "100运行中"
// if(){} for(){} 函数的()和{}没有封闭作用域 其中定义的变量为全局变量
var color = "red";
console.log(color); // red
console.log(box); // undefined
if (true) {
var color = "yellow";
var box = "circle";
}
console.log(color); // yellow
console.log(box); // circle
var i = -1;
console.log(i); // -1
console.log(j); // undefined
for(var i = 0, j = 0; i < 1; i++, j++){
console.log(i); // 0
console.log(j); // 0
}
console.log(i); // 1
console.log(j); // 1
// JavaScript Array 对象
var box = [5, 3, 4, 2, 1];
// sort() 按字母顺序对数组中的元素进行排序
box.sort(); // [1, 2, 3, 4, 5]
// push() 向数组的末尾添加一个或更多元素，并返回新的长度。
box.push(6); // 6
box; // [1, 2, 3, 4, 5, 6]
/**
* JavaScript 操作 DOM 对象
*/
/*
* 文档对象模型（Document Object Model，简称DOM）
*/
// 确认对话框 有确定和取消两个按钮
if (confirm("请选择!")) {
console.log("刚刚你选择的是确定按钮");
} else {
console.log("刚刚你选择的是取消按钮");
}
// 输入提示框
// 第一个参数是说明文字 第二个参数是默认值 返回结果是输入的内容
var box = prompt("请输入一个数字", 0);
if (box) {
console.log("你刚刚输入的内容是: " + box);
} else if (box == null) {
console.log("你刚刚取消了输入!");
} else if (box == "") {
console.log("你刚刚什么也没有输入!");
} else {
console.log("你怎么进来的?");
}
// 打印
print();
/*
* 重要事项：请不要混淆方法 Window.open() 与方法 Document.open()，这两者的功能完全不同。
* 为了使您的代码清楚明白，请使用 Window.open()，而不要使用 open()。
* window.open() 方法用于打开一个新的浏览器窗口或查找一个已命名的窗口。
* window.open(URL, name, features, replace)
* URL 一个可选的字符串，声明了要在新窗口中显示的文档的 URL。如果省略了 URL 这个参数，或者它的值是空字符串，那么新窗口就不会显示任何文档。
* name 一个可选的字符串，该字符串是一个由逗号分隔的特征列表，该字符声明了新窗口的名称。这个名称可以用作标记 <a> 和 <form> 的属性 target 的值。如果该参数指定了一个已经存在的窗口，那么 open() 方法就不再创建一个新窗口，而只是返回对指定窗口的引用。在这种情况下，features 将被忽略。
* features 一个可选的字符串，声明了新窗口要显示的标准浏览器的特征。如果省略该参数，新窗口将具有所有标准特征。
* replace 一个可选的布尔值。规定了装载到窗口的 URL 是在窗口的浏览历史中创建一个新条目，还是替换浏览历史中的当前条目。true - URL 替换浏览历史中的当前条目。false - URL 在浏览历史中创建新的条目。
*/
/*
* 窗口特征（Window Features）
* channelmode=yes|no|1|0 是否使用剧院模式显示窗口。默认为 no。
* directories=yes|no|1|0 是否添加目录按钮。默认为 yes。
* fullscreen=yes|no|1|0 是否使用全屏模式显示浏览器。默认是 no。处于全屏模式的窗口必须同时处于剧院模式。
* height=pixels 窗口文档显示区的高度。以像素计。
* left=pixels 窗口的 x 坐标。以像素计。
* location=yes|no|1|0 是否显示地址字段。默认是 yes。
* menubar=yes|no|1|0 是否显示菜单栏。默认是 yes。
* resizable=yes|no|1|0 窗口是否可调节尺寸。默认是 yes。
* scrollbars=yes|no|1|0 是否显示滚动条。默认是 yes。
* status=yes|no|1|0 是否添加状态栏。默认是 yes。
* titlebar=yes|no|1|0 是否显示标题栏。默认是 yes。
* toolbar=yes|no|1|0 是否显示浏览器的工具栏。默认是 yes。
* top=pixels 窗口的 y 坐标。
* width=pixels 窗口的文档显示区的宽度。以像素计。
*/
// 打开一个新的浏览器窗口并且返回这个窗口 这个新窗口里面什么也没有
var box = window.open();
box; // Window {...}
// 父页面操作子窗口
box.alert("我是父页面操作子窗口弹出来的");
// 给这个新窗口定义一个名字
box.name = "newWindowTest";
// 在这个新窗口中打开百度首页
window.open("http://www.baidu.com/", "newWindowTest");
// 在父页面直接打开腾讯首页
window.open("http://www.qq.com/", "_parent");
// 在新窗口打开网易
window.open("http://www.sina.com.cn/", "_blank", "width=200,height=100", false);
// 子窗口操作父窗口
// 没有测试成功
/*
Uncaught SecurityError: Blocked a frame with origin "null" from accessing a frame with origin "null". Protocols, domains, and ports must match.
*/
window.opener.document.write("子窗口控制该语句在父窗口输出");
window.parent.document.write("子窗口控制该语句在父窗口输出");
// screenLeft 和 screenTop 属性返回窗口相对于屏幕的 X 和 Y 坐标。
// screenX 和 screenY 属性返回窗口相对于屏幕的 X 和 Y 坐标。
// 所有主流浏览器都支持 screenLeft 和 screenTop 属性，Firefox 除外。
// 所有主要浏览器都支持 screenX 和 screenY 属性，Internet Explorer 除外。
// 兼容问题解决方案
var leftX = typeof window.screenLeft == 'number' ? window.screenLeft: window.screenX;
var topY = typeof window.screenTop == 'number' ? window.screenTop: window.screenY;
// Internet Explorer 下运行
leftX; // 6
topY; // 60
typeof window.screenLeft; // "number"
typeof window.screenX; // "number"
window.screenLeft; // 6
// window.screenX 在 IE 中类型也为 number 但是获取的值 不正确
// 所以只能判断 window.screenLeft 的类型是否为 number
window.screenX; // 0
// Firefox 下运行
leftX; // 21
topY; // 193
typeof window.screenLeft; // "undefined"
typeof window.screenX; // "number"
window.screenLeft; // undefined
window.screenX; // 21
// innerWidth 返回窗口的文档显示区的宽度。不包含工具条与滚动条。
// innerHeight 返回窗口的文档显示区的高度。不包含工具条与滚动条。
// 所有主流浏览器都支持 innerWidth 和 innerHeight 属性。IE 8 及更早 IE版本不支持这两个属性。
/*
* compatMode 标准兼容模式
* BackCompat：标准兼容模式关闭。BackCompat 对应 quirks mode 怪异模式。
* 宽度 document.body.clientWidth; 高度 document.body.clientHeight;
* CSS1Compat：标准兼容模式开启。CSS1Compat 对应 strict mode 严格模式。
* 宽度 document.documentElement.clientWidth; 高度 document.documentElement.clientHeight;
* 历史原因 早期的浏览器 Netscape 4 和 Explorer 4 对 CSS 进行解析时，并未遵守 W3C 标准，这时的解析方式就被我们称之为 quirks mode(怪异模式)，但随着 W3C 的标准越来越重要，众多的浏览器开始依照 W3C 标准解析 CSS，仿照 W3C 标准解析 CSS 的模式我们叫做 strict mode(严格模式)
*/
// chrome 中运行
window.innerWidth; // 428
window.innerHeight; // 909
document.documentElement.clientWidth; // 428
document.documentElement.clientHeight; // 909
document.body.clientWidth; // 428
document.body.clientHeight; // 909
document.compatMode; // "BackCompat"
// IE11 中运行
window.innerWidth; // 1010
window.innerHeight; // 26
document.documentElement.clientWidth; // 1010
document.documentElement.clientHeight; // 26
document.body.clientWidth; // 1010
document.body.clientHeight; // 26
document.compatMode; // "BackCompat"
// IE8 中运行
window.innerWidth; // undefined
window.innerHeight; // undefined
document.documentElement.clientWidth; // 1007
document.documentElement.clientHeight; // 23
document.body.clientWidth; // 994
document.body.clientHeight; // 0
document.compatMode; // "CSS1Compat"
// 兼容问题解决方案
var width = window.innerWidth;
var height = window.innerHeight;
if (typeof width != 'number') {
// IE 8 及更早 IE 版本
if (document.compatMode == 'CSS1Compat') {
// 标准兼容模式开启
width = document.documentElement.clientWidth;
height = document.documentElement.clientHeight;
} else {
// 标准兼容模式关闭
width = document.body.clientWidth;
height = document.body.clientHeight;
}
}
// chrome 中运行
width; // 428
height; // 909
// IE11 中运行
width; // 1010
height; // 26
// IE8 中运行
width; // 1007
height; // 23
// outerWidth 属性设置或返回窗口的外部宽度，包括所有的界面元素（如工具栏/滚动）。
// outerHeight 属性设置或返回一个窗口的外部高度，包括所有界面元素（如工具栏/滚动条）。
// 所有主流浏览器都支持 outerWidth 和 outerHeight 属性。IE 8 及更早 IE 版本不支持该属性。
// chrome 中运行
window.outerWidth; // 795
window.outerHeight; // 665
// IE11 中运行
window.outerWidth; // 1023
window.outerHeight; // 529
// window.screen 用户屏幕的信息 可以省略window前缀
window.screen;
// 可用的屏幕宽度
screen.availWidth; // 1280
// 可用的屏幕高度
screen.availHeight; // 944
// 屏幕宽度
screen.width; // 1280
// 屏幕高度
screen.height; // 1024
var myWindow = window.open('', '', 'width=200,height=200');
// window.moveTo(x, y) 可把窗口的左上角移动到一个指定的坐标(x,y)。
myWindow.moveTo(100, 100);
// window.resizeTo(width, height) 调整窗口大小为指定宽高
myWindow.resizeTo(500, 500);
var myWindow = window.open('', '', 'width=200,height=200');
// window.moveBy(x, y) 可把窗口的左上角移动到一个指定的坐标(x,y)。
myWindow.moveBy(100, 100);
// window.resizeBy(width, height) 根据指定的像素来调整窗口的大小。
// width 必需。要使窗口宽度增加的像素数。可以是正、负数值。
// height 可选。要使窗口高度增加的像素数。可以是正、负数值。
myWindow.resizeBy(100, 100);
// setTimeout() 超时调用 只执行依次
// 第一个参数是需要执行的代码，可以是字符串，它能自动解析。
// 第二个参数是间隔时间，单位为毫秒。
// 不容易扩展
setTimeout("console.log('Lee')", 2000); // Lee
// 封装行不好
function box() {
console.log('Lee');
}
setTimeout(box, 2000); // Lee
// 推荐
setTimeout(function() {
console.log('Lee');
}, 2000) // Lee
// 返回值是超时调用的ID
var box = setTimeout(function() {
console.log('Lee');
}, 5000)
// 取消超时调用 在五秒之内取消调用 将不再输出 Lee
clearTimeout(box);
// setInterval() 间歇调用 每设定时间后调用一次
// 返回值是间歇调用的ID
var box = setInterval(function() {
console.log('Lee');
}, 1000) // 见下
/*
Lee
Lee
Lee
...
*/
//取消间歇调用 取消之后不再调用
clearInterval(box);
// window.location 对象用于获得当前页面的地址 (URL)，并把浏览器重定向到新的页面。对象在编写时可不使用 window 这个前缀。
location === window.location; // true
window.document.location === window.location; // true
window.location;
// 重定向到百度首页
location = "http://www.baidu.com";
location.href = "http://www.baidu.com";
location.assign("http://www.baidu.com");
location.replace("http://www.baidu.com");
// location.href 切换后，产生历史记录，可以退回到原页面。
// location.replace 切换后，不产生历史记录，不可以退回到原页面。
// window.history 对象包含浏览器的历史。window.history 对象在编写时可不使用 window 这个前缀。
window.history;
// 前一条历史记录
history.back();
// 后一条历史记录
history.forward();
// 历史记录条数
history.length;
// 寻找指定的历史记录
history.go(10);
// window.navigator 对象包含有关访问者浏览器的信息。window.navigator 对象在编写时可不使用 window 这个前缀。
navigator;
/*
* 浏览器渲染引擎(又称排版引擎或内核)
* 1.1 Trident [?tra?dnt] 又称为MSHTML。IE内核。
* 1.2 EdgeHTML Edge内核。
* 2. Gecko [?gek??] Firefox内核。
* 3. Presto [?prest??] Opera前期内核(已废弃)，Opera现已改用Blink内核。从下面的测试看Opera的内核是 Webkit。
* 4. Blink 由Google和Opera开发，由webkit衍生而来。Chrome 和 Opera 内核。从下面的测试看Chrome的内核是 Webkit。
* 5. Webkit Safari内核。从下面的测试看 Webkit 也是 Opera 和 Chrome 的内核。
* Webkit 包含两块内容
* 1. WebCore 关于浏览器渲染引擎的，是由KDE所开发的KHTML的衍生产品。
* 2. JSCore 关于脚本处理的，是由KDE所开发的KJS的衍生产品。
*/
// 用户代理字符串
navigator.userAgent; // 见下
// Opera
// "Mozilla/5.0 (Windows NT 6.1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/57.0.2987.133 Safari/537.36 OPR/44.0.2510.1449"
// Chrome
// "Mozilla/5.0 (Windows NT 6.1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/50.0.2661.75 Safari/537.36"
// Safari
// "Mozilla/5.0 (Windows NT 6.1) AppleWebKit/534.57.2 (KHTML, like Gecko) Version/5.1.7 Safari/534.57.2"
// Firefox
// "Mozilla/5.0 (Windows NT 6.1; rv:53.0) Gecko/20100101 Firefox/53.0"
// Edge
// "Mozilla/5.0 (Windows NT 6.1; Trident/7.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; InfoPath.3; .NET4.0C; .NET4.0E; rv:11.0) like Gecko"
// IE8
// "Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.1; Trident/7.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; InfoPath.3; .NET4.0C; .NET4.0E)"
// window.opera opera5开始有的一个脚本object，一个boolean的值，用来检察浏览器是否是opera。
// 没有测试成功
// 系统
navigator.platform;
// 插件
navigator.plugins;
navigator.plugins.length;
// MIME(Multipurpose Internet Mail Extensions)多用途互联网邮件扩展类型。
// IE浏览器不支持
navigator.mimeTypes;
navigator.mimeTypes.length;
// window.Node 节点类型值 1元素 2属性 3文本 对象在编写时可不使用 window 这个前缀。
window.Node; // function Node() { [native code] }
Node.ELEMENT_NODE; // 1
Node.ATTRIBUTE_NODE; // 2
Node.TEXT_NODE; // 3
// window.document 对象在编写时可不使用 window 这个前缀。
// 在百度运行
window.document; // #document
document.title; // "百度一下，你就知道"
document.URL; // "https://www.baidu.com/"
document.domain; // "www.baidu.com"
// 服务器端上一个URL
document.referrer; // ""
// 在百度>新闻运行
window.document; // #document
document.title; // "百度新闻搜索——全球最大的中文新闻平台"
document.URL; // "http://news.baidu.com/"
document.domain; // "news.baidu.com"
// 服务器端上一个URL
document.referrer; // "https://www.baidu.com/"
// 状态栏默认值
window.defaultStatus = "默认状态";
// 状态栏设置值
window.status = "状态";
window.find("盒子"); // true
window.onload = function() {
// 页面加载完成后自动执行代码
}
var all = document.getElementsByTagName("*");
console.log(all.length); // 见下
// chrome
// 11
// ie11
// 11
// ie8 浏览器多一个节点是把<!DOCTYPE html>文档声明也算进去了
// 12
// Firefox/53.0
// 11
// 火狐浏览器的firebug打开后，会自动生成一个div，所以获取的标签会多一个 测试不成功 或许是低版本
var li = document.getElementsByTagName("li");
console.log(li.length); // 2
console.log(li[0]); // <li>no1</li>
console.log(li.item(0)); // <li>no1</li>
console.log(li.item(0).innerHTML); // no1
var box = document.getElementById("box");
// 获取标签的文本,包含HTML标签
console.log(box.innerHTML); // 我是一个盒子
// 赋值
box.innerHTML = "";
console.log(box.innerHTML); // 空白
// 获取style属性中的color值
console.log(box.style.color); // red
// 在chrome浏览器中运行的输出结果
// 其他浏览器中会有差异
console.log(box.getAttribute('style')); // color:red;
console.log(box.getAttribute('class')); // box
// class为保留字 用className代替class
console.log(box.className); // box
console.log(box.getAttribute("onclick")); // hello()
box.removeAttribute("style");
box.setAttribute("style", "color:blue;");
// 获取元素节点的类型值
console.log(box.nodeType); // 1
console.log(box.getAttributeNode('style').nodeType); // 2
console.log(box.firstChild.nodeType); // 3
// 获取元素节点的标签名
console.log(box.tagName); // DIV
console.log(box.nodeName); // DIV
console.log(box.getAttributeNode('style').nodeName); // style
console.log(box.firstChild.nodeName); // #text
// 获取文本节点的文本内容
console.log(box.nodeValue); // null
console.log(box.getAttributeNode('style').nodeValue); // color:blue;
console.log(box.firstChild.nodeValue); // 我是一个盒子
// NodeList集合 返回当前节点的所有子节点
console.log(box.childNodes); // [text]
// 获取第一个子节点
console.log(box.firstChild); // "我是一个盒子"
console.log(typeof box.firstChild); // object
// 获取最后一个子节点
console.log(box.lastChild); // "我是一个盒子"
console.log(typeof box.lastChild); // object
// 返回文档对象 也就是根节点
console.log(box.ownerDocument); // #document
// 父节点
console.log(box.parentNode); // <body>...</body>
// 前一个兄弟节点
console.log(box.previousSibling); // #text
// 后一个兄弟节点
console.log(box.nextSibling); // #text
// 集合数组 保存这个元素节点的属性列表
console.log(box.attributes); // NamedNodeMap {0: class, 1: id, 2: name, 3: onclick, 4: style, length: 5}
console.log(box.attributes[0]); // class="box"
console.log(box.attributes['id']); // id="box"
// 创建一个文本节点
var text = document.createTextNode("测试");
// 创建一个p节点
var p = document.createElement("p");
// 把文本添加到p节点里
p.appendChild(text);
// 添加到box的子节点列表的最后
box.appendChild(p);
// 在box前面添加一个节点p
box.parentNode.insertBefore(p, box);
var span = document.createElement('span');
// 把文本添加到span节点里
span.appendChild(text);
// 把p标签替换成span标签
box.parentNode.replaceChild(span, p)
// true 克隆标签和其内容 false 只克隆标签
var clone = box.previousSibling.cloneNode(true);
box.appendChild(clone);
var clone = box.previousSibling.cloneNode(false);
box.appendChild(clone);
box.removeChild(box.firstChild);
// 获取文本并过滤掉html
box.innerText; // "我是一个盒子"
box.outerText; // "我是一个盒子"
// 获取文本不过滤HTML
box.innerHTML; // "<span>我是一个盒子</span>"
box.outerHTML; // "<div class="box" id="box" name="box" style="color:red;" onclick="hello()"><span>我是一个盒子</span></div>"
// normalize() 方法移除空的文本节点，并连接相邻的文本节点。不知道怎么测试
box.normalize();
var box = document.getElementById("box");
box.childNodes; // ["我是一个盒子"]
box.childNodes.length; // 1
// 把前三个字符分离出来成一个新的节点
box.childNodes[0].splitText(3); // "个盒子"
box.childNodes; // ["我是一", "个盒子"]
box.childNodes.length; // 2
var box = document.getElementById("box");
box.childNodes; // ["我是一个盒子"]
// 把前三个字符删除
box.childNodes[0].deleteData(0, 3);
box.childNodes; // ["个盒子"]
var box = document.getElementById("box");
box.childNodes; // ["我是一个盒子"]
// 在第一个字符前面插入hello
box.childNodes[0].insertData(0, 'Hello');
var box = document.getElementById("box");
box.childNodes; // ["我是一个盒子"]
// 把第0个到2个替换成miss
box.childNodes[0].replaceData(0, 2, 'miss');
box.childNodes; // ["miss一个盒子"]
var box = document.getElementById("box");
box.childNodes; // ["我是一个盒子"]
// 获取第0个到2个字符
box.childNodes[0].substringData(0, 2); // "我是"
box.childNodes; // ["我是一个盒子"]
// 每次刷新,都让box处于可见范围内
box.scrollIntoView();
// children会忽略文本节点
box.children; // ["<span>我是一个盒子</span>", "<span></span>"]
box.children.length; // 2
// childNodes不忽略文本节点
box.childNodes; // [" 我是一个盒子 ", "<span>我是一个盒子</span>", " 我是一个盒子 ", "<span></span>", " "]
box.childNodes.length; // 5
// 不忽略文本节点
var p = box.firstChild; // " 我是一个盒子 "
// 忽略文本节点
var pp = box.firstElementChild; // "<span>我是一个盒子</span>"
// 判定 box 是不是 p 的父节点
box.contains(p); // true
box.contains(pp); // true
// 火狐旧版本不支持contains() 创建了自己的方法 compareDocumentPosition(); 没有测试
document.write("测试完成");
// 快速定位到指定位置进行调试
debugger;
/**
* 通过身份证号码获取生日信息
*/
function getBirthdayFromID(no){
var year,month,day;
if(no.length == 15){
// 身份证为15位 7-12位出生年月日 比如670401代表1967年4月1日
year = '19' + no.substr(6,2);
month = no.substr(8,2);
day = no.substr(10,2);
} else if(no.length == 18){
// 身份证为18位 7-14位出生年月日 比如19670401代表1967年4月1日
year = no.substr(6,4);
month = no.substr(10,2);
day = no.substr(12,2);
}
return year + "-" + month + "-" + day;
}
/**
* 获取光标所在对象的位置
*/
function getCursorPosition() {
var position = {top:0, left:0};
var e = window.event;
position.left = e.clientX - e.offsetX + (document.body.scrollLeft || document.documentElement.scrollLeft);
position.top = e.clientY - e.offsetY + (document.body.scrollTop || document.documentElement.scrollTop);
return position;
/*
* e.clientX 鼠标指针位置相对于窗口客户区域的 x 坐标。
* e.clientY 鼠标指针位置相对于窗口客户区域的 y 坐标。
* e.offsetX 鼠标指针位置相对于触发事件的对象的 x 坐标。
* e.offsetY 鼠标指针位置相对于触发事件的对象的 y 坐标。
* document.body.scrollLeft 屏幕滚动的 x 坐标，使用默认dtd。
* document.documentElement.scrollLeft 屏幕滚动的 x 坐标，使用http://www.w3.org/TR/html4/loose.dtd。
* document.body.scrollTop 屏幕滚动的 y 坐标，使用默认dtd。
* document.documentElement.scrollTop 屏幕滚动的 y 坐标，使用http://www.w3.org/TR/html4/loose.dtd。
*
* var myDivObj = document.getElementById("myDiv");
* myDivObj.style.left = position.left;
* myDivObj.style.top = position.top;
*
* position:absolute;
*/
}
