Реализовал создание блоков на js (естественно не сохраняется) и так же как советовали здесь (Doofy) отключил события pointer-events:none;
но с помощью after
создал кнопку при клике на который блок должен удалится , но любой код приводит к провалу , помогите разобраться (осваиваю js), код:
<!DOCTYPE html>
<html lang="en">
<head>
<title></title>
<meta charset="UTF-8">
<style>
#createJavaScript{
width:300px;
height:200px;
background:#cc0000;
float:left;
margin:2px;
position:relative;
pointer-events:none;
padding:5px;
}
#createJavaScript:after{
content:"Удалить";
display:block;
position:absolute;
right:5px;
top:5px;
color:#fff;
pointer-events:all;
cursor:pointer;
}
#createJavaScript:hover:after{
content:"Удалить блок";
}
#elem{
position:absolute;
top:10px;
left:20px;
}
.myButton{
width:100%;
height:40px;
margin:20px 0;
border:1px solid #cc0000;
position:relative;
}
</style>
</head>
<body>
<div class="myButton">
<button id="elem" type="button " onclick="myFunction()">Создать блок</button>
</div>
<script>
elem.onclick = function(myFunction) {
var oDiv = document.createElement("DIV");
oDiv.id = "createJavaScript";
var oText = document.createTextNode("Блок создан через JavaScript");
oDiv.appendChild(oText);
document.body.appendChild(oDiv);
};
</script>
</body>
</html>
Код 100% рабочий , как реализовать удаление созданного на js (не jquery) ,блока при клике на его after
на javascript?