JS基础——自动生成一组新闻

最新推荐文章于 2024-01-13 21:59:18 发布

波克比520

最新推荐文章于 2024-01-13 21:59:18 发布

阅读量657

点赞数

分类专栏： javascript 文章标签： js

本文链接：https://blog.csdn.net/u011175410/article/details/40655335

版权

javascript 专栏收录该内容

55 篇文章 0 订阅

订阅专栏

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>JS基础——自动生成一组新闻</title>
<script>
window.onload = function(){
	var	oBtn = document.getElementById('bnt1');
	var oUl = document.getElementById('list');
	var arr = [
		'新闻内容一新闻内容一新闻内容一新闻内容一',
		'新闻内容二新闻内容二新闻内容二新闻内容二',
		'新闻内容三新闻内容三新闻内容三新闻内容三',
		'新闻内容四新闻内容四新闻内容四新闻内容四',
		'新闻内容五新闻内容五新闻内容五新闻内容五'
	];
	var onOff = true;
	
	oBtn.onclick = function(){
		if(onOff){
			for(var i=0; i<arr.length; i++){
				oUl.innerHTML += '<li>'+ arr[i] +'</li>';	
			}
		}
		onOff = false;		
	};
};
</script>
</head>

<body>
<input id="bnt1" type="button" value="自动生成一组新闻">
<ul id="list"></ul>
</body>
</html>

思路：

通过自定义属性，定义一个开关，默认是true，然后点击按钮，通过for循环生成所有li，再把生成的所有li塞给ul，这样点击按钮就能生成一组新闻了，为了让它只能生成一次，所以，当它循环结束时，我们再把开关定义为false，这样再次点击就不会继续生成一组新闻了。

波克比520

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JS基础——自动生成一组新闻

JS基础——自动生成一组新闻window.onload = function(){ var oBtn = document.getElementById('bnt1'); var oUl = document.getElementById('list'); var arr = [ '新闻内容一新闻内容一新闻内容一新闻内容一', '新闻内容二新闻内容二新闻内容二新闻内容二',
复制链接

扫一扫

专栏目录