Question

你好

所以，我有一些动态创建HTML元素的JS代码。更准确地说，它创建了div元素，其中还包含其他一些内容。

其中每个div元素都包含img个元素。如何实现这样的效果，即在某个img元素中单击div元素时，是否删除了精确的div元素？

这是我动态创建元素的代码：

＆＃13;

function addQuestion(question){
    var s = "<div style=\"width:100%;background-color:transparent;border-top:none;border-bottom:2px solid white;border-right:none;border-left:none;\"><div style=\"margin:5px;font-family:Verdana;color:white;\">"+"<p>"+noTag(question)+"</p>"+"</div></div>";

    var div = document.createElement('div');
    div.innerHTML = s;
    document.getElementById("div_questions").appendChild(div);
}

＆＃13;

目前它不会创建img元素。但我们的想法是，在每个div元素中，它还会创建一个img元素，当点击该元素时，会删除那个 div元素。< / p>

我怎样才能做到这一点？

Answer 1

尝试以下代码......

            var _cotainerDiv = document.getElementsById("holderDiv");

            var _tempDiv = document.createElement("div");
            $(_tempDiv).css({
                //Css properties...
            });

            _cotainerDiv.appendChild(_tempDiv);

            var _tempImg = new Image();
            _tempImg.src = "...../imagePath";
            _tempImg.onload=function(){
                this.addEventListener("click", onImageClick);
            }
            _tempDiv.appendChild(_tempImg);


            function onImageClick(event)
            {
                var _curImg = event.target;

                _cotainerDiv.removeChild(_curImg.parentElement);
            }

使用动态创建的元素在self上调用函数

1 个答案: