js/jQuery怎么添加div、button、p’等HTML元素的代码
通过jQuery设置HTML里面的div和button等代码。目的是实现HTML文件里面是空白body,然后body里面的内容全都是js实现输出的。最主要的是用到jQuery的构建html元素和append追加元素等功能。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>武林编程</title>
</head>
<body>
</body>
<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
var firstdiv = $('<div id="ymDiv" style="position:relative;width:300px;height:300px;background-color:grey"></div>').text('我是一个div');
$("body").append(firstdiv);
$("#ymDiv").hover(function(){
$("div").append('<button href="#" id="ymA" type="button" style="position:absolute;top:0;right:0;">编辑</button>');
$("#ymA").click(function(){
console.log("protest");
});
$("#ymA").dblclick(function(){
console.log("protest-dblclick");
});
},function(){
$("#ymA").remove();
});
});
</script>
</html>