引子

作为前端，不可避免的经常对浏览器地址进行操作，要获取浏览器的参数，很简单，方法也很多，我之前经常自己用js的indexof +substr来获取，这样获取相对费事一点，不是很好。今天在这里总结一下浏览器参数获取及参数的操作。

js获取浏览器参数

单纯的用js获取浏览器参数比较简单，我今天介绍一个用正则来写的获取参数的方法，相对比较好一些。

function getQueryString(name) {
    var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
    var r = window.location.search.substr(1).match(reg);
    if (r != null) return unescape(r[2]); return null;
    }

就上面这一个小小的函数就可以轻松的搞定！

假如你的地址是：

http://www.haorooms.com/uploads/example/urloperate/demo1.html?name=11111&zz=haorooms

调用方法

console.dir(getQueryString("name"));

console.dir(getQueryString("zz"));

谷歌浏览器f12 console的输出结果：

11111
haorooms

引子

今天做了弹框显示优酷视频的案例，有点有问题，但是通过其他办法解决了。自己感觉，虽然解决了，但是还是不是很好！不知道大家有没有更好的解决办法！

背景

弹框显示优酷视频，且一个页面中有很多优酷视频，做到效果如下图：

难点

div弹出层是在一个页面当中的，点击关闭，让优酷视频重新载入。（控制优酷视频的播放和暂停，定位指定时间和播放当前时间，优酷当中已经给了API函数，但是重新载入视频没有）

解决方法

js制作弹出层，相信大家应该都会做，今天就不总结js弹出层的效果了，关于js弹出层，后面有时间再讲！

首先，优酷API开发平台的地址: http://open.youku.com/

激活一下邮箱，进入工具，会生成一个client_id，vid是视频的id，通过浏览器地址或者分享里面可以复制到。

调用视频的代码如下：

<div id="youkuplayer" style="width:480px;height:400px"></div>
<script type="text/javascript" src="http://player.youku.com/jsapi">
player = new YKU.Player('youkuplayer',{
styleid: '0',
client_id: '7ea1dcdd8ea5d799',
vid: '替换成优酷视频ID',
autoplay: true,
show_related: true,
events:{
onPlayEnd: function(){ /*your code*/ },
onPlayStart: function(){ /*your code*/ },
onPlayerReady: function(){ /*your code*/ }
}
});
function playVideo(){
player.playVideo();
}
function pauseVideo(){
player.pauseVideo();
}
function seekTo(s){
player.seekTo(s);
}
function currentTime(){
return player.currentTime();
}
</script>

引子

今天是九一八事变八十三周年，大家勿忘国耻！加油学习！经济和技术等各个方面超过小日本！

在javascript和jquery中，都有对各种高度的写法，在这里，我们就着重讲一下窗口、文档等高度的理解。(宽度和高度差不多！)

jquery的各种高度

首先来说一说$(document)和$(window)，如下：

$(document).height();//整个网页的高度
$(window).height();//浏览器可视窗口的高度
$(window).scrollTop();//浏览器可视窗口顶端距离网页顶端的高度（垂直偏移）

用一句话理解就是：当网页滚动条拉到最低端时，

$(document).height() == $(window).height() + $(window).scrollTop()。

注意，是拉到最低端！

当网页高度不足浏览器窗口时$(document).height()返回的是$(window).height()

假如您要获取整个网页的高度，不建议用$("html").height()、$("body").height()的高度，

原因：

$("body").height()：body可能会有边框，获取的高度会比$(document).height()小； $("html").height()：在不同的浏览器上获取的高度的意义会有差异，说白了就是浏览器不兼容。

说道这里，提及边框和margin还有padding，我们自然想到了jquery的另外的两个高度，那就是innerHeight()和outerHeight()

innerHeight()和outerHeight()不适用于window 和 document对象，对于window 和 document对象可以使用.height()代替。innerHeight()和outerHeight()主要用来获取标签的高度。

innerHeight()

引子

js的setTimeout方法用处比较多，通常用在页面刷新了、延迟执行了等等。但是很多javascript新手对setTimeout的用法还是不是很了解。虽然我学习和应用javascript已经两年多了，但是对setTimeout方法，有时候也要查阅资料。今天对js的setTimeout方法做一个系统地总结。

setInterval与setTimeout的区别

说道setTimeout，很容易就会想到setInterval，因为这两个用法差不多，但是又有区别，今天一起总结了吧！

setTimeout

定义和用法: setTimeout()方法用于在指定的毫秒数后调用函数或计算表达式。　　

语法: setTimeout(code,millisec) 　

参数： code （必需）：要调用的函数后要执行的 JavaScript 代码串。millisec（必需）：在执行代码前需等待的毫秒数。 　 提示： setTimeout() 只执行 code 一次。如果要多次调用，请使用 setInterval() 或者让 code 自身再次调用 setTimeout()。

setInterval

setInterval() 方法可按照指定的周期（以毫秒计）来调用函数或计算表达式。

setInterval() 方法会不停地调用函数，直到 clearInterval() 被调用或窗口被关闭。由 setInterval() 返回的 ID 值可用作 clearInterval() 方法的参数。

语法: setInterval(code,millisec[,"lang"])

参数: code 必需。要调用的函数或要执行的代码串。millisec 必须。周期性执行或调用 code 之间的时间间隔，以毫秒计。

返回值: 一个可以传递给 Window.clearInterval() 从而取消对 code 的周期性执行的值。

区别

通过上面可以看出，setTimeout和setinterval的最主要区别是：

setTimeout只运行一次，也就是说设定的时间到后就触发运行指定代码，运行完后即结束。如果运行的代码中再次运行同样的setTimeout命令，则可循环运行。（即 要循环运行，需函数自身再次调用 setTimeout()）

而 setinterval是循环运行的，即每到设定时间间隔就触发指定代码。这是真正的定时器。

setinterval使用简单，而setTimeout则比较灵活，可以随时退出循环，而且可以设置为按不固定的时间间隔来运行，比如第一次1秒，第二次2秒，第三次3秒。

我个人而言，更喜欢用setTimeout多一些！

setTimeout的用法