Home >Web Front-end >Front-end Q&A >How to click to add a box in javascript
Method: 1. Bind the click event to the button element and specify the event processing function; 2. Use the append() method in the event processing function to achieve the effect of clicking to add a box. The syntax is "specify element object. append("Inserted box element");".
The operating environment of this tutorial: Windows 10 system, JavaScript version 1.8.5, Dell G3 computer.
How to click to add a box in javascript
append() method inserts the specified content at the end of the selected element.
The syntax is:
$(selector).append(content,function(index,html))
The parameters are as follows:
<html>
<head>
<meta charset="utf-8">
<title>123</title>
<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
$("#btn1").click(function(){
$("p").append(" <div>这是一个插入进来的div</div>");
});
});
</script>
</head>
<body>
<p>这是一个段落。</p>
<p>这是另一个段落</p>
<button id="btn1">在段落后添加一个div</button>
</body>
</html>Output result:
##Related recommendations:
The above is the detailed content of How to click to add a box in javascript. For more information, please follow other related articles on the PHP Chinese website!