实现元素的动态添加

abstract：<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>实战热身</title> </head> <body> <input type="text"&nbs

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>实战热身</title>
</head>
<body>

	<input type="text" name="info">
	<button>提 交</button>

	<ul></ul>

	<script type="text/javascript">
		// 获取元素
		let input = document.getElementsByName('info')[0];
		let button = document.getElementsByTagName('button')[0];
		let ul = document.getElementsByTagName('ul')[0];

		// 添加事件
		button.onclick = function(){
			// 创建元素  li
			let li = document.createElement('li');
			// 获取文本框内容
			li.innerHTML = input.value;
			// 添加数据
			ul.appendChild(li);
			// 清空文本框
			input.value = '';
		}

	</script>

</body>
</html>

Correcting teacher：西门大官人Correction time：2019-03-29 09:50:00
Teacher's summary：流程很清晰，请思考一下，document.getElementsByName这样频繁使用的语句写起来很长。如何“偷懒”呢？

实现元素的动态添加

Popular Entries