JavaScript中的div和filter错误

 在ie8里用div和filter显示本地图片，代码大致如下：

 

1）方法一：

首先新建了一个div：
<div id="div1">在这里显示图片</div>

然后在js函数里面用filter加载图片：
var fileUrl=="C:\\1-1.jpg";
 var div1 = document.getElementById("div1");                  
    div1.style.width = "400px";  
    div1.style.height = "400px";
    div1.style.filter="progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod = scale;)";   
    div1.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = fileUrl;

这样子用div显示图片是没有问题的。

 

2）方法二

用代码动态创建div
 var div1 =document.createElement("div");
 var fileUrl=="C:\\1-1.jpg";
 var div1 = document.getElementById("div1");                  
 div1.style.width = "400px";  
 div1.style.height = "400px";
 div1.style.filter="progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod = scale;)";   
 div1.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = fileUrl;
    这样子用filter显示图片时，就提示div1.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = fileUrl;错误， 提示属性找不到

问题所在：

    两者就是div创建方式不同，一个是html中定义的，一个是动态创建的，动态创建的div怎么就不认filters.item属性呢？

解决方法：

     后来经群里人指点，说有可能是div所在位置不同：

    HTML中定义的div是存在于HTML页面容器中的，动态创建的div是存在于内存中的，所以要使用filters.item属性时，首先将动态创建的div放入到页面容器中，然后就可以调用filters.item属性了：

     代码如下就可以通过了：

 var div1 =document.createElement("div");
 var fileUrl=="C:\\1-1.jpg";
 var div1 = document.getElementById("div1");                  
 div1.style.width = "400px";  
 div1.style.height = "400px";

 document.appendChild(div1);
 div1.style.filter="progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod = scale;)";   
 div1.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = fileUrl;