小编sim*_* xu的帖子

如何在JavaScript中检测HTMLCollection/NodeList?

我不确定我目前的实施是否始终可用:

function isNodeList(nodes) {
    var result = Object.prototype.toString.call(nodes);
    // modern browser such as IE9 / firefox / chrome etc.
    if (result === '[object HTMLCollection]' || result === '[object NodeList]') {
        return true;
    }
    //ie 6/7/8
    if (typeof(nodes) != 'object') {
        return false;
    }
    // detect length and item 
    if (!('length' in nodes) || !('item' in nodes)) {
        return false;
    }
    // use the trick NodeList(index),all browsers support
    try {
        if (nodes(0) === null || (nodes(0) && nodes(0).tagName)) return true;
    } …
Run Code Online (Sandbox Code Playgroud)

javascript

22
推荐指数
6
解决办法
2万
查看次数

什么是document.getElementById?

考虑以下代码:

<script>
function testFunc(){
    alert('test')
}
$(function(){
    var g = document.getElementById , w = window.testFunc ;
    //g
    alert(typeof(g));
    alert(String(g));
    alert(g instanceof Object);
    alert(g instanceof Function);
    //w
    alert(typeof(w));
    alert(String(w));
    alert(w instanceof Object);
    alert(w instanceof Function);
    //run it
    alert(g('t'));
            w();

});
</script>
Run Code Online (Sandbox Code Playgroud)

现代浏览器(chrome,IE 9,Firefox)中的代码行为相同.结果是:

typeof =>"function"
String =>"function #funcName#{[native code]}"
instanceof Object => true
instanceof Function => true
它有点奇怪,我们可以w通过使用轻松调用(),但是g,我们必须调用它是这样的:

g.call(document,elementId);
Run Code Online (Sandbox Code Playgroud)

说到IE 6,结果完全不同:


// g
typeof =>"object"
String =>"function getElementById {[native code]}"
instanceof Object => false
instanceof …

javascript

9
推荐指数
1
解决办法
2160
查看次数

javascript数组在推送新元素时如何工作?

我在Chrome/Firefox中测试了这段代码:

console.time('simple push');
var arr0 = [];
for(var i =0; i < 1000000; i++){
    arr0.push(i);
}
console.timeEnd('simple push');
console.time('set length and push');
var arr1 = [];
arr1.length=1000000;
for(var j =0; j < 1000000; j++){
    arr1[j]=j;
}
console.timeEnd('set length and push');
console.time('new Array push');
var arr2 = new Array(1000000);
for(var k =0; k < 1000000; k++){
    arr2[k]=k;
}
console.timeEnd('new Array push');
Run Code Online (Sandbox Code Playgroud)

Chrome 13结果

简单推送:59ms
设置长度和推送:192ms
新阵列推送:187ms

Firefox 4结果

简单推送:76ms
设置长度和推送:44ms
新阵列推送:40ms

我怀疑

所以new Array操作绝对是最慢的,但我想知道为什么吗?
为什么设置长度在Chrome和Firefox中表现不同,看来预分配的内存在Chrome中效果不佳?

更新

我更新了Chrome和FF结果.

javascript arrays

7
推荐指数
1
解决办法
222
查看次数

调用焦点时按钮和跨度有什么区别?

HTML代码片段:

<div contenteditable='true' id="txt">123<b>456</b>789</div> 
<button onclick="get()">Click Me</button> 
<span onclick="get()">Click Me</span> 
<script>   
  function get(){
      document.getElementById('txt').focus()
  }
</script>
Run Code Online (Sandbox Code Playgroud)
  • 单击名为的节点txt,先设置光标7,然后单击"按钮".
    观察div的光标位置.

  • 单击名为的节点txt,先设置光标7,然后单击Span.
    观察div的光标位置

比较div的光标位置,
您会发现Buttonclick事件不会改变div的原始光标位置.
Span点击事件确实如此.

这真的很奇怪,所以这里发生了什么?
(我的测试基于WebKit浏览器.)

html javascript button

7
推荐指数
1
解决办法
640
查看次数

迷惑javascript的构造函数和原型?

function MyObject(){}
Array.prototype={};
MyObject.prototype={};
var a=new Array();
var b=new MyObject();
alert(a.constructor==Array);//true
alert(b.constructor==MyObject);//false
Run Code Online (Sandbox Code Playgroud)

javascript constructor prototype-programming

6
推荐指数
1
解决办法
859
查看次数

如何在谷歌地图中绑定标记的触摸事件?

谷歌地图api不支持触摸事件

但现在我需要在地图和标记上做一些事情,比如长按地图,点击标记,拖动标记.

我想做的就像iOS的谷歌地图客户端一样

javascript html5 google-maps google-maps-api-3 touch-event

5
推荐指数
2
解决办法
1万
查看次数