JS：无法在IE中删除创建的元素
[英]JS: Can't remove created Element in IE
问题描述
I'm dynamically creating an image via javascript like this: 
我正在通过javascript这样动态创建图像：
var dragimg = null;
function createImage(g) {
dragimg = document.createElement("img");
dragimg.src = "link/to/image.png";
dragimg.style.width = "50px";
dragimg.style.position = "absolute";
dragimg.style.zIndex = 100;
$("body").prepend(dragimg);
}
After creating the Image, I want to remove it at some point by calling this function: 创建图像后，我想通过调用以下函数将其删除：
function removeImage() {
dragimg.remove();
}
This works well in Chrome, Firefox & Opera. 这在Chrome，Firefox和Opera中运行良好。 However, it doesn't work in Internet Explorer 11 . 但是，它在Internet Explorer 11中不起作用。
I'd also like to point out I have an document.onmousemove function set which manipulates the left and top attribute of the created image when the mouse moves. 我还要指出的是，我有一个document.onmousemove函数集，该函数集可以在鼠标移动时操纵所创建图像的left和top属性。 This works well in all browsers - but I'm not sure if it has something to do with the remove-problem. 这在所有浏览器中都可以正常使用-但我不确定是否与删除问题有关。
I've also tried to remove the image by dragimg.parentNode.removeChild(dragimg) , but same result. 我也尝试通过dragimg.parentNode.removeChild(dragimg)删除图像，但结果相同。
3 个解决方案
解决方案1
3 已采纳 2014-11-15 01:40:10
A few things other than the classic just-use-jquery answer: 除了经典的just-use-jquery答案，还有一些其他事情：
-
element.remove()is not supported yet by Internet Explorer, according to the API: http://msdn.microsoft.com/en-us/library/ie/hh772117(v=vs.85).aspx .根据API，Internet Explorer尚不支持element.remove()： http : //msdn.microsoft.com/zh-cn/library/ie/hh772117element.remove().aspx 。 It's an experimental technology: https://developer.mozilla.org/en-US/docs/Web/API/ChildNode.remove这是一项实验性技术： https : //developer.mozilla.org/zh-CN/docs/Web/API/ChildNode.remove - Are you sure
parentNode.removeChildisn't working because it is for me: http://jsfiddle.net/limdauto/wztm1dgk/您确定parentNode.removeChild不起作用是因为它适合我： http : //jsfiddle.net/limdauto/wztm1dgk/
Before 之前
After 后
解决方案2
1 2014-11-15 01:28:33
To use jQuery remove method you need this: 要使用jQuery remove方法，您需要这样做：
function removeImage() {
$(dragimg).remove();
}
Your dragimg is a dom element, but $(dragimg) is a jQuery element. 您的dragimg是一个dom元素，但是$(dragimg)是一个jQuery元素。 While jQuery prepend method accepts dom elements, remove does not - it applies to jQuery element itself or to selector. 尽管jQuery prepend方法接受dom元素，但remove不接受-它适用于jQuery元素本身或选择器。 More about jQuery remove and prepend . 有关jQuery remove和prepend的更多信息。
解决方案3
0 2014-11-15 01:26:25
I'm not sure the context where you are calling the removeImage function, but the code below demonstrates inserting the image element and removes it after an interval of 2 seconds. 我不确定要调用removeImage函数的上下文，但是下面的代码演示了插入图像元素并在2秒的间隔后将其删除。
Note: Replace the path to your image. 注意：替换图像的路径。
<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
</head>
<body>
<script type="text/javascript">
var dragimg = null;
function createImage(g) {
dragimg = document.createElement("img");
dragimg.src = "someimage.jpg";
dragimg.style.width = "50px";
dragimg.style.position = "absolute";
dragimg.style.zIndex = 100;
$("body").prepend(dragimg);
}
function removeImg() {
dragimg.parentNode.removeChild(dragimg);
}
createImage(null);
window.setInterval(removeImg, 2000);
</script>
</body>
</html>
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.