firebug的一個(gè)有趣現(xiàn)象介紹
var obj = {length:0,splice:function(){}}
console.log(obj)
猜猜上面會(huì)打印出啥?
沒(méi)錯(cuò),打印出來(lái)的看起來(lái)是一個(gè)空數(shù)組。。。
在FIREBUG里如果一個(gè)對(duì)象同時(shí)擁有l(wèi)ength屬性和splice方法,就會(huì)被firebug顯示為數(shù)組的形式。。。
如果以前注意過(guò)的話就會(huì)發(fā)現(xiàn)JQUERY就是這么寫(xiě)的,通過(guò)選擇器打印出來(lái)的看起來(lái)跟數(shù)組一樣。
一直以來(lái)我都很好奇為毛返回的數(shù)組,但是卻有數(shù)組根本沒(méi)有的方法,也沒(méi)有數(shù)組該有的方法,比如:pop等
最后通過(guò)查資料才發(fā)現(xiàn)這么一個(gè)有趣的現(xiàn)象。。
但是在IE下面打印出來(lái)的就是正常的[Object Object]了。
于是就可以這么玩一下。。。。
var push = Array.prototype.push;
var splice = Array.prototype.splice;
var a = function() {
var a = function(name) {
return new a.fn.init(name)
}
a.fn = a.prototype;
a.fn.init = function(name) {
var arr = document.getElementsByTagName(name);
merge(this,arr);
}
a.fn.splice = splice;
a.fn.init.prototype = a.fn;
return a;
}()
function merge(first, second) {//完全抄襲jquery中的merge方法- -
var i = first.length || 0, j = 0;
if( typeof second.length === "number") {
for(var l = second.length; j < l; j++) {
first[i++] = second[j];
}
} else {
while(second[j] !== undefined) {
first[i++] = second[j++];
}
}
first.length = i;
return first;
}
a.fn.css = function(pop, val) {
for(var i = 0; i < this.length; i++) {
if(this[i].nodeType===1){
this[i].style[pop] = val;
}
}
return this;
}
var ab = a('div');
ab.css('backgroundColor', '#444444').css('borderWidth', '2px').css('borderStyle', 'solid')
于是,山寨版jquery并且只支持tagName選擇器并且只有山寨CSS方法的一個(gè)庫(kù)就誕生了。。
- 使用firebug進(jìn)行調(diào)試javascript的示例
- Jquery使用Firefox FireBug插件調(diào)試Ajax步驟講解
- javascript 在firebug調(diào)試時(shí)用console.log的方法
- 使用Firebug對(duì)js進(jìn)行斷點(diǎn)調(diào)試的圖文方法
- 使用JavaScript檢測(cè)Firefox瀏覽器是否啟用了Firebug的代碼
- Firebug入門指南(Firefox瀏覽器)
- firefox插件Firebug的使用教程
- firefox firebug中文入門教程 腳本之家新年特別版
- Firefox+FireBug使JQuery的學(xué)習(xí)更加輕松愉快
- Firebug 字幕文件JSON地址獲取代碼
- Javascript 調(diào)試?yán)?Firebug使用詳解六
- 強(qiáng)悍無(wú)比的WEB開(kāi)發(fā)好助手FireBug(Firefox Plugin)
- js之WEB開(kāi)發(fā)調(diào)試?yán)?Firebug 下載
- FireBug 調(diào)試JS入門教程 如何調(diào)試JS
相關(guān)文章
JS基于FileSaver.js插件實(shí)現(xiàn)文件保存功能示例
這篇文章主要介紹了JS基于FileSaver.js插件實(shí)現(xiàn)文件保存功能,結(jié)合實(shí)例形式演示了FileSaver.js插件的具體使用技巧,需要的朋友可以參考下2016-12-12JavaScript設(shè)計(jì)模式之適配器模式介紹
這篇文章主要介紹了JavaScript設(shè)計(jì)模式之適配器模式介紹,適配器模式,一般是為要使用的接口,不符本應(yīng)用或本系統(tǒng)使用,而需引入的中間適配層類或?qū)ο蟮那闆r,需要的朋友可以參考下2014-12-12bootstrap3 dialog 更強(qiáng)大、更靈活的模態(tài)框
這篇文章主要介紹了bootstrap3 dialog 更強(qiáng)大、更靈活的模態(tài)框,本文通過(guò)效果展示實(shí)例代碼詳解,需要的朋友可以參考下2017-04-04Typescript井字棋的項(xiàng)目實(shí)現(xiàn)
本文主要介紹了Typescript井字棋的項(xiàng)目實(shí)現(xiàn),文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2022-08-08js事件on動(dòng)態(tài)綁定數(shù)據(jù),綁定多個(gè)事件的方法
今天小編就為大家分享一篇js事件on動(dòng)態(tài)綁定數(shù)據(jù),綁定多個(gè)事件的方法,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2018-09-09JavaScript 高級(jí)篇之閉包、模擬類,繼承(五)
本篇主要分享我對(duì)閉包的理解及使用閉包完成私有屬性、模擬類、繼承等,結(jié)合大量例子,希望大家能快速掌握!首先讓我們先從一些基本的術(shù)語(yǔ)開(kāi)始吧2012-04-04JavaScript類的繼承操作實(shí)例總結(jié)
這篇文章主要介紹了JavaScript類的繼承操作,結(jié)合實(shí)例形式總結(jié)分析了JavaScript面向?qū)ο蟪绦蛟O(shè)計(jì)中類的繼承常見(jiàn)實(shí)現(xiàn)方式與操作技巧,需要的朋友可以參考下2018-12-12javascript九宮格圖片隨機(jī)打亂位置的實(shí)現(xiàn)方法
這篇文章主要為大家詳細(xì)介紹了javascript九宮格圖片隨機(jī)打亂位置的實(shí)現(xiàn)方法,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-03-03解決循環(huán)中setTimeout執(zhí)行順序的問(wèn)題
今天小編就為大家分享一篇解決循環(huán)中setTimeout執(zhí)行順序的問(wèn)題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2018-06-06js定時(shí)調(diào)用方法成功后并停止調(diào)用示例
這篇文章主要介紹了js定時(shí)調(diào)用方法成功后并停止調(diào)用的實(shí)現(xiàn),需要的朋友可以參考下2014-04-04