<!--@description-->
<!--@author beyondx-->
<!--@date Created in 2022/08/01/ 21:36-->
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>标题</title>
<style>
#div1{
width: 300px;
height: 300px;
border: 1px solid red;
}
</style>
</head>
<body>
<input type="button" value="html()" id="btnHtml1"/>
<input type="button" value="$()" id="btn1"/> <br/><br/>
<div id="div1">
<p>p1
<span>span1</span>
</p>
</div>
</body>
</html>
<script src="jquery-1.12.4.js"></script>
<script>
$(function () {
// 原生js中创建节点: document.write(); innerHTML; document.createElement();
// jQuery中如何创建节点呢?
// html(); $();
// 1.html();
$('#btnHtml1').click(function () {
// 获取内容: html()方法 不给参数
// 获取到 元素的 所有内容
// console.log($('#div1').html());
// 1.2 设置内容: html()方法 给参数
// 设置内容, 会把原来的内容 覆盖
$('#div1').html('我是设置的内容<a href="https://www.baidu.com">百度一下</a>');
});
// 2.$();
// 确实能创建元素,但是创建的元素只存在于内存中,如果要在页面上显示,就要追加.
$('#btn1').click(function () {
var $link = $('<a href="http://news.baidu.com">我是新闻</a>');
// console.log($link);
// 追加
$('#div1').append($link);
});
});
</script>
