DOM对象

DOM 节点

在HTML DOM (Document Object Model) 中 , 每一个元素都是节点:

• 文档是一个文档节点。
• 所有的HTML元素都是元素节点。
• 所有HTML属性都是属性节点。
• 文本插入到HTML元素是文本节点。
• 注释是注释节点。

创建标签(元素)

介绍：createElement()方法通过指定名称创建一个元素。

创建button标签

在body标签中加入一个button按钮。

<script type="text/javascript">
	var body = document.body;
	let btn = document.createElement('button');
	btn.textContent = "按钮";
	body.append(btn);
</script>

给按钮添加点击事件

<script type="text/javascript">
	var body = document.body;
	let btn = document.createElement('button');
	btn.textContent = "按钮";
	// 添加点击事件
	btn.onclick = function(){
		alert('点击了按钮');
	}
	body.append(btn);
</script>

给按钮添加class

btn.className = 'fa fa-users';

给按钮添加style

btn.setAttribute('style', 'font-size:20px;');

给按钮添加id

btn.id = 'btn_1';