动态添加HTML元素

今天做东东的时候要用js创建html元素然后动态给该元素添加方法，走了不少弯路。最后把解决方法发布，让大家以后少走弯路。

js文件

function CheckNull(id)

{

     //DoSomeThing   

}

var CheckNewNull= function(id)

{

    return function(){

        CheckNull(id);

     }

}

 

给Html元素添加方法

//创建一个textarea

std2area=document.createElement("textarea");

//设置属性

std2area.setAttribute("id","member_Task"+position);

std2area.setAttribute("name","member_Task"+position);

//添加方法

std2area.attachEvent("onblur",CheckNewNull("member_Task"+position));

 

如果添加方法写成：std2area.attachEvent("onblur",CheckNull("member_Task"+position));

或者写成std2area.attachEvent("onblur",CheckNull);

那么会出现错误。原因是这样做是将CheckNull("member_Task"+position)的返回值赋给onblur

而不是将函数CheckNull赋给该元素。所以正确的做法是将CheckNull用一个函数返回，如上所示。

 

最后写写添加方法的其它途径：

 

  Std2area.onblur=CheckNull;

  Std2area.setAttribute(“onblur”,CheckNull);

<html>
<head>
<script>
<!--   
  function   addrows()   
  {   
      str='<input   name="textfield4"   type="text"   size="15">'; 
      var   abc=document.createElement(str);
      document.body.insertBefore(abc);   
  }   
//-->   
</script>   
 </head> 
 <body> 

  <input   type="button"   name="Button"   value="Button"   onClick="addrows();">
  </body>
  </html>

var div = document.createElement("DIV");
div.innerHTML= "……";
document.getElementById(id).appendChild(div);

 

posted @ 2009-02-06 14:17  三颗屎  阅读(370)  评论(0)    收藏  举报