关于JavaScript中变量的相互引用

变量相互引用的原因是：由于某些类型的变量是按地址存储的而导致的两个或多的参数的值互相影响：

测试如下：

关于对节点对象操作产生的影响：

由于是函数是按值传递，所以在插入节点时，引用的是节点本身，而不是它的一个克隆，所以节点被转移了

如：

最后一个是关于节点的移除的，本来以为用innerHTML=""来移除元素内容的话，在IE中会把创建的节点从内存中彻底消除，事实并非如此，而是产生了很奇怪的现象：

如：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<style type="text/css">
body{
font-family:"微软雅黑","Times New Roman", Times, serif;
font-size:12px;}
.c2{
border:1px solid #ccc;
width:500px;
height:150px;}
.c1{
border:2px solid #000;
width:300px;
height:100px;}
.c3{
border:1px solid #ccc;
width:100px;
height:50px;}
</style>
</head>
<body>
<p>来回重复点击add_div和inner试试，会发现奇怪的现象。点击alert，又会发现创建的div没从内存清除。<br />用removeChild方法会很正常的表现</p>
<div id="div2" class="c2"></div>
<input type="button" value="add_div" />
<input type="button" value="inner" />
<input type="button"  value="remove" />
<input type="button" value="alert" />
<script type="text/javascript">
if(!+"\v1"){}else alert("请在IE下测试");
var elem=document.createElement("div");
elem.className="c1";
elem.innerHTML="creatediv c1";
var elem2=document.createElement("div");
elem2.className="c3";
elem2.innerHTML="creatediv c3";
elem.appendChild(elem2);
var div2=document.getElementById("div2");
var inputs=document.getElementsByTagName("input");
inputs[0].onclick=function(){div2.appendChild(elem);};
inputs[1].onclick=function(){div2.innerHTML=""};
inputs[2].onclick=function(){div2.removeChild(elem)};
inputs[3].onclick=function(){alert(elem+elem2)};
</script>
</body>
</html>

posted on 2010-05-09 22:05 progresstudy 阅读(481) 评论(0) 收藏举报