firebug的一个有趣现象介绍


Posted in Javascript onNovember 30, 2011
var obj = {length:0,splice:function(){}} 
console.log(obj)

猜猜上面会打印出啥?
没错,打印出来的看起来是一个空数组。。。
在FIREBUG里如果一个对象同时拥有length属性和splice方法,就会被firebug显示为数组的形式。。。
如果以前注意过的话就会发现JQUERY就是这么写的,通过选择器打印出来的看起来跟数组一样。
一直以来我都很好奇为毛返回的数组,但是却有数组根本没有的方法,也没有数组该有的方法,比如:pop等
最后通过查资料才发现这么一个有趣的现象。。
但是在IE下面打印出来的就是正常的[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方法的一个库就诞生了。。
Javascript 相关文章推荐
面向对象的编程思想在javascript中的运用上部
Nov 20 Javascript
检测一个函数是否是JavaScript原生函数的小技巧
Mar 13 Javascript
Javascript中的call()方法介绍
Mar 15 Javascript
浅谈JavaScript变量的自动转换和语句
Jun 12 Javascript
BootStrap实现轮播图效果(收藏)
Dec 30 Javascript
vue中v-cloak解决刷新或者加载出现闪烁问题(显示变量)
Apr 20 Javascript
Vue实现动态添加或者删除对象和对象数组的操作方法
Sep 21 Javascript
使用webpack编译es6代码的方法步骤
Apr 28 Javascript
layui监听select变化,以及设置radio选中的方法
Sep 24 Javascript
CountUp.js实现数字滚动增值效果
Oct 17 Javascript
React中使用UMEditor的方法示例
Dec 27 Javascript
vue设置全局访问接口API地址操作
Aug 14 Javascript
兼容IE、FireFox、Chrome等浏览器的xml处理函数js代码
Nov 30 #Javascript
Javascript的getYear、getFullYear、getUTCFullYear异同分享
Nov 30 #Javascript
chrome原生方法之数组
Nov 30 #Javascript
使用Javascript接收get传递的值的代码
Nov 30 #Javascript
关于递归运算的顺序测试代码
Nov 30 #Javascript
对javascript的一点点认识总结《javascript高级程序设计》读书笔记
Nov 30 #Javascript
Jquery插件之打造自定义的select标签
Nov 30 #Javascript
You might like
PHP字符转义相关函数小结(php下的转义字符串)
2007/04/12 PHP
php实现水仙花数示例分享
2014/04/03 PHP
php使用ob_flush不能每隔一秒输出原理分析
2015/06/02 PHP
php数组遍历类与用法示例
2019/05/24 PHP
php写app用的框架整理
2019/09/29 PHP
Js动态创建div
2008/09/25 Javascript
JS面向对象、prototype、call()、apply()
2009/05/14 Javascript
JavaScript中各种编码解码函数的区别和注意事项
2010/08/19 Javascript
情人节专属 纯js脚本1k大小的3D玫瑰效果
2012/02/11 Javascript
jQuery和AngularJS的区别浅析
2015/01/29 Javascript
js中 javascript:void(0) 用法详解
2015/08/11 Javascript
jquery实现的Accordion折叠面板效果代码
2015/09/02 Javascript
浅谈javascript中的三种弹窗
2016/10/21 Javascript
Angular-Touch库用法示例
2016/12/22 Javascript
JavaScript轮播图简单制作方法
2017/02/20 Javascript
详解vue渲染从后台获取的json数据
2017/07/06 Javascript
通过源码分析Vue的双向数据绑定详解
2017/09/24 Javascript
vue实现重置表单信息为空的方法
2018/09/29 Javascript
JavaScript深入V8引擎以及编写优化代码的5个技巧
2019/06/24 Javascript
javascript的hashCode函数实现代码小结
2020/08/11 Javascript
React倒计时功能实现代码——解耦通用
2020/09/18 Javascript
解决vue项目运行npm run serve报错的问题
2020/10/26 Javascript
[42:20]2014 DOTA2华西杯精英邀请赛5 24 DK VS NewBee
2014/05/25 DOTA
在Python下使用Txt2Html实现网页过滤代理的教程
2015/04/11 Python
利用python模拟sql语句对员工表格进行增删改查
2017/07/05 Python
Python使用Scrapy保存控制台信息到文本解析
2017/12/27 Python
Python使用Tkinter实现机器人走迷宫
2018/01/22 Python
python实现搜索文本文件内容脚本
2018/06/22 Python
在IPython中进行Python程序执行时间的测量方法
2018/11/01 Python
多视角3D逼真HTML5水波动画
2016/03/03 HTML / CSS
canvas线条的属性详解
2018/03/27 HTML / CSS
Skyscanner波兰:廉价航班
2017/11/07 全球购物
总经理驾驶员岗位职责
2013/12/04 职场文书
努力学习演讲稿
2014/05/10 职场文书
淘宝活动总结范文
2014/06/26 职场文书
幼儿园2016圣诞节活动总结
2016/03/31 职场文书