在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;