JS备忘录

个人备忘用……

 

 

一、 获取某一节点下的所有子孙节点

 getElementsByTagName("*")

 

 

二、字符串连接的效率

将要链接的字符串做成数组，最后进行join操作，会比单纯字符串+=操作效率更高

 

 

三、获取iframe元素

例如获取<iframe id="test"></iframe>的head

IE使用document.getElementById("test").document.getElementsByTagName("head")[0];

其余用document.getElementById("test").contentDocument.getElementsByTagName("head")[0];

自然，跨域的话是访问不到的

 

 

四、判断动态加载script是否完成

var head = document.getElementsByTagName("head")[0]; var creater = document.createElement("script"); creater.src = "xxx.php"; head.appendChild(creater); if (creater.readyState){ creater.onreadystatechange = function(){ if (creater.readyState == "loaded" || creater.readyState == "complete"){ // IE判断加载完成 } } }else { creater.onload = function(){ // 其它浏览器判断加载完成 } // 如果要实现加载完script后立即移除script，则应该在判断script加载完才能进行移除操作。否则IE可能在script代码未执行的时候就把script移除掉导致代码失效。

 

 

五、往动态生成的iframe里发送表单

如果iframe利用DOM的方式创建，如下

<form method="get" action="zz.php" target="tester" id="sss"> </form> <a href="javascript:void(0);" mce_href="javascript:void(0);" οnclick="aaa(); return false;">asdfasdf</a> <mce:script type="text/javascript"><!-- function aaa(){ var b = document.getElementsByTagName("body")[0]; var c = document.createElement("iframe"); c.name = "tester"; b.appendChild(c); if (c.readyState){ c.onreadystatechange = function(){ if (c.readyState == "loaded" || c.readyState == "complete"){ document.getElementById("sss").submit(); } } }else { c.onload = function(){ document.getElementById("sss").submit(); } } } // --></mce:script>

则表单发送会出现问题。试验了IE和FF

在FF底下，表单会变成无限循环的发送，问题比较好理解，iframe加载完成，执行了表单发送的代码，表单往iframe发送完后，iframe又被onload了一次，于是继续执行发送表单的操作。

将

c.onload = function(){
   document.getElementById("sss").submit();
}

改为

c.onload = function(){

   c.onload = null;

   document.getElementById("sss").submit();
}
理论可以避免。

但IE下更为夸张，表单直接变成弹新窗口发送，目前未找到好解决方案。

如果放弃DOM方式，则用以下代码可以达到往动态生成的iframe里发送表单数据。

<form method="get" action="zz.php" target="tester" id="sss"> </form> <a href="javascript:void(0);" mce_href="javascript:void(0);" οnclick="aaa(); return false;">asdfasdf</a> <div id="zz"></div> <mce:script type="text/javascript"><!-- function aaa(){ var b = document.getElementsByTagName("body")[0]; document.getElementById("zz").innerHTML = "<iframe name=/"tester/"></iframe>"; document.getElementById("sss").submit(); } // --></mce:script>

直接采用了innerHTML的方式进行动态创建，解决了问题。

 

 

六、判断元素b是否被包含在元素a中

可以使用循环法

function check_in_dom(a,b){ if (a==b) return true; else if (!a.parentNode) return false; else if (a.parentNode==b) return true; else return check_in_dom(a.parentNode, b); }

但有更方便的方法，因为除FF外有contains方法，而FF也可以通过compareDocumentPosition来进行判断

此代码似乎有些问题，对compareDocumentPosition理解还不深，待检验……

function check_in_dom(a,b){ return b.contains ? (b.contains(a)) : a.compareDocumentPosition(b)<20; } H.core.DOM.contains = function(parent, child) { if(!parent || !child) return false; if (parent.contains) { return parent.contains(child); } return parent.compareDocumentPosition(child) - 19 > 0 || parent==child; }

 

 

 

七、不使用eval，把json字符串转成json对象

一般都是用eval("("+xx+")");的方式来转换，但其实也可以不使用eval，使用new Function，但效率如何我就不清楚了。

但有一个好处就是，eval之后，作用域可能会出问题，而new Function不会

var xx = '{"aa":"aaa","bb":"bbb"}'; var z = new Function("return "+xx)(); alert(z.aa);

 

八、IE为元素绑定事件时的this指针

document.getElementById("btnShow2").attachEvent("onclick", function () { var event = arguments[0]||window.event; alert(event.srcElement.id); //alert(this.id); });