/****************** 收集常用重要 *********************/

一、获取窗口

1 $(window).height() 　　　　　　　　　　//浏览器时下窗口可视区域高度
2 $(document).height()　　　　 　　 　　//浏览器时下窗口文档的高度
3 $(document.body).height()　　　　　　//浏览器时下窗口文档body的高度
4 $(document.body).outerHeight(true)　//浏览器时下窗口文档body的总高度 包括border padding margin
5 $(window).width() 　　　　　　　　　　//浏览器时下窗口可视区域宽度
6 $(document).width()　　　　　　　　　 //浏览器时下窗口文档对于象宽度
7 $(document.body).width()　　　　　　 //浏览器时下窗口文档body的高度
8 $(document.body).outerWidth(true)　 //浏览器时下窗口文档body的总宽度 包括border padding margin

 

二、JQ获取页面节点的方法

1、获取指定节点或id或class

匹配节点名称：$("div") 　　匹配ID名：$("#cur")　　　　匹配class名：$(".className")

2、获取和修改属性的值

通过id来属性值：$("#idName").attr("src");　　　　// 获取id为idName中的src的值

通过id来替换属性值：$("#idName").attr("src","http://sss.com");　　　　// 修改属性值

3、节点的内容

$("#idName").text();　// 获取节点的内容　　　　$("#idName").text("aaaaa");　　//改变节点的内容

$("#idName).html();　// 获取节点的html内容　　$("#idName).html("<div>aaa</div>")　　//改变节点的内容

4、获取父元素对象

$("#idName").parent();

5、获取是否有子元素

$("#idName option").length();　　　　如果返回0表示idName下没有option元素

三、获得地址栏中完整的地址

thisURL = document.URL; 

thisHREF = document.location.href; 

thisSLoc = self.location.href; 

thisDLoc = document.location; 

href = document.referrer;

显示主机名：

thisTLoc = top.location.href; 　　　　// top表示主窗口，location表示当前窗口，如果你的文件只有一个框架，没有iframe和frmaeset，那么是完全一致的，没有区别。 

thisPLoc = parent.document.location; 

thisTHost = top.location.hostname; 

thisHost = location.hostname; 　　　　// 显示域名

tmpHPage = thisHREF.split( "/" ); 

thisHPage = tmpHPage[ tmpHPage.length-1 ]; 

tmpUPage = thisURL.split( "/" ); 

thisUPage = tmpUPage[ tmpUPage.length-1 ]; 

四、收藏本站

function ss(){
　　window.external.addFavorite('http://www.gouwulian.com/', '哈哈哈公司')
}

设置首页
function aa(){
　　document.getElementById("setIndex").style.behavior='url(#default#homepage)';document.getElementById("setIndex").setHomePage('http://www.www.com/');
}

四、jquery中获取键盘按键

测试浏览器:IE6/IE7/IE8，FireFox，Chrome，Opera

$(document).keyup(function(e){
        var key =  e.which;
        if(key == 27){

             alert('按下了ESC键，关闭弹出层');
        }
});

或者（这个只在:IE8，FireFox，Chrome测试过）

$(document).keyup(function(e){

    if (e.keyCode == 27) 
    {
        alert('按下了ESC键，关闭弹出层');
    }

})

五、JS事件

document.onkeypress = function (e) {
    var code;
    if (!e) {
        var e = window.event;
    }
    if (e.keyCode) {
        code = e.keyCode;
    }
    else if (e.which) {
        code = e.which;
    }
    if (code == 13) {
        document.getElementById("searchButton").click();
        return false;
    }
}

jquery:

$(function(){ 
    $('#seach').keypress(function(e) {
         var key = window.event ? e.keyCode : e.which;
        if(e.keyCode == 13){
            alert('a');
         }
    });
});

　　

六、获取一个元素下的其它元素

var $ul = $(".z_neir ul");

$ul.find("li:last").prependTo($ul);　　　　　　// 获取ul下第一个li

七、选择器的另一种写法

下面意思是查找sd的子元素里面找ul

var sd = $("#boxs");
var ul = $("ul", sd);
alert(ul.html);

与$("#boxs ul")的意思相同，可能执行的效率不同。

八、选择器的另一种写法

 获取指定元素要写成：
　　var ws = $(".focusmenu")[0].offsetWidth; alert(ws);　　　　// 注意[0]，因为$(".focusmenu)返回是的一个数组

alert($("#question")[0].selectedIndex);       // 因为$("#question")返回的是一个数组，这样写才能取到
if($("#question")[0].selectedIndex == 0){
     return false;
}

九、动态添加的元素，click时不能获取的到

例：

<div id="box"></div>

添加：

$("#box).html("<span>aaaa</span><span>bbbb</span>");

获取不到:

$("#box span").click(functino(){

　　$(this).html();

})

通过live()来获取方法

$("#box span").live('click', functino(){

　　$(this).html();

})

十、JS浮点运算精度问题

var num=0.4;

for(var i=0; i<4; i++){

　　alert(num*i);

}

输出：

0

0.4

0.8

1.2000000000000002　　出现问题

解决方法：alert((num*i).toFixed(2));　　　　// 获取小数点后两位;

十一、BackgroundPosition animate 背景动画的问题

BackgroundPosition animate实现背景动画效果却发现实现不了

jquery animate本身不支持背景图片的动画

使用条件：

1、jquery必须1.4.2版本

2、需要使用jquery.backgroundPosition.js插件

$(".recommend").mouseover(function(){

　　$(this).animate({"backgroundPosition": "100px 0"}, 300);　　　　// 这样就可以获取到了

});

可以在js文件中加入

(function(t) {
　　if (!document.defaultView || !document.defaultView.getComputedStyle) {
　　　　var v = t.curCSS;
　　　　t.curCSS = function(y, w, z) {
　　　　　　if (w === "background-position") {
　　　　　　　　w = "backgroundPosition"
　　　　　　}
　　　　　　if (w !== "backgroundPosition" || !y.currentStyle || y.currentStyle[w]) {
　　　　　　　　return v.apply(this, arguments)
　　　　　　}
　　　　　　var x = y.style;
　　　　　　if (!z && x && x[w]) {
　　　　　　　　return x[w]
　　　　　　}
　　　　　　return v(y, "backgroundPositionX", z) + " " + v(y, "backgroundPositionY", z)
　　　　}
　　}

　　var u = t.fn.animate;
　　t.fn.animate = function(w) {
　　　　if ("background-position" in w) {
　　　　　　w.backgroundPosition = w["background-position"];
　　　　　　delete w["background-position"]
　　　　}
　　　　if ("backgroundPosition" in w) {
　　　　　　w.backgroundPosition = "(" + w.backgroundPosition
　　　　}
　　　　return u.apply(this, arguments)
　　};

　　function s(x) {
　　　　x = x.replace(/left|top/g, "0px");
　　　　x = x.replace(/right|bottom/g, "100%");
　　　　x = x.replace(/([0-9\.]+)(\s|\)|$)/g, "$1px$2");
　　　　var w = x.match(/(-?[0-9\.]+)(px|\%|em|pt)\s(-?[0-9\.]+)(px|\%|em|pt)/);
　　　　return [parseFloat(w[1], 10), w[2], parseFloat(w[3], 10), w[4]]
　　}
　　t.fx.step.backgroundPosition = function(x) {
　　　　if (!x.bgPosReady) {
　　　　　　var z = t.curCSS(x.elem, "backgroundPosition");
　　　　　　if (!z) {
　　　　　　　　z = "0px 0px"
　　　　　　}
　　　　　　z = s(z);
　　　　　　x.start = [z[0], z[2]];
　　　　　　var w = s(x.end);
　　　　　　x.end = [w[0], w[2]];
　　　　　　x.unit = [w[1], w[3]];
　　　　　　x.bgPosReady = true
　　　　}
　　　　var y = [];
　　　　y[0] = ((x.end[0] - x.start[0]) * x.pos) + x.start[0] + x.unit[0];
　　　　y[1] = ((x.end[1] - x.start[1]) * x.pos) + x.start[1] + x.unit[1];
　　　　x.elem.style.backgroundPosition = y[0] + " " + y[1]
　　}
})(jQuery);

十二、fadeIn的ie6/7/8中的失效

一、这种方式是没有问题的

<div class="fadein" style="display:none;">
　　<div class="relative">
　　　　<div>I am going to fade in ;</div>
　　　　<div>I am going to fade in ;</div>
　　</div>
</div>
<input type="button" id="btn" value="开始">

<script>
$(function(){
　　$("#btn").click(function(){
　　　　$('.fadein').fadeIn("slow");
　　})
});
</script>

二、如果给relative加一个定位ie6、7、8下就会有问题

<style>
.fadein .relative { position:relative; }
</style>

十三、sildeDown()的失效

使用sildeDown()方法需要将指定元素为定位元素，否则就会失效

<style>

　　.box { position:relative; }

</style>

<div class= "box">box</div>

$("box").sildeDown("slow");