js 如何动态创建列表?

zzyhost 2018-05-14 01:39:17
例如,有个json,我想把下面的Item1......换成json里的数据,js如何动态创建? 谢了,给个demo吧
<body>
<ul class="mui-table-view">
<li class="mui-table-view-cell">Item 1</li>
<li class="mui-table-view-cell">Item 2</li>
<li class="mui-table-view-cell">Item 3</li>
</ul>
</body>
...全文
864 2 打赏 收藏 转发到动态 举报
写回复
用AI写文章
2 条回复
切换为时间正序
请发表友善的回复…
发表回复
qq_36883606 2018-05-14
  • 打赏
  • 举报
回复
给li标签加个id,再用jquery通过id获取li标签,&(function(){$.(“#id ”).html(json);});
天际的海浪 2018-05-14
  • 打赏
  • 举报
回复

<script type="text/javascript">
$(function(){
	var json = [
		"aaa",
		"bbb",
		"ccc"
	];
	for (var i = 0; i < json.length; i++) {
		$('<li class="mui-table-view-cell"></li>').text(json[i]).appendTo(".mui-table-view");
	}
});

</script>

<ul class="mui-table-view">
</ul>

你将从《深入浅出javascript(中文版)》学到什么?这么说你准备从写html和css的静态网页跃进到编写动态网络应用程序脚本了?这里就是起点。《深入浅出java script》带你游历令人兴奋的交互式网页创建过程。为了启发你的思考,《深入浅出javascript(中文版)》覆盖了所有的java script基本知识,从基本网络编程技巧,如变量、函数和循环语句,到高级一些的专题,如表单验证、dom操作、客户端对象、脚本程序调试——甚至是aiax!赶快做好准备……快速响应的网站离你只有几页纸那么远。   为何《深入浅出javascript(中文版)》看上去如此不同?   我们认为你的时间如此宝贵以至于不应该花费在为新概念伤脑筋上面。《深入浅出java script》用最新的认知科学和学习理论打造多感官的学习体验,它运用丰富的视觉样式激发你的大脑工作,而不是密密麻麻的文字让你看了昏昏欲睡。 序 1 交互式网络:感觉虚拟世界 2 存储数据:每项事物都有自己的位置 3 探索客户端:浏览器探索 4 决策:前有叉路,面对抉择 5 循环:自我重复的风险 6 函数:简化、重复利用、回收再利用 7 表单与验证:让用户全盘托出 8 驾驭网页:利用dom分割html 9 为数据带来生命:科学对象怪人 10 创建自定义对象:自定义对象让你为所欲为 11 除错务尽:好脚本也会出错 12 动态数据:贴心易感的网络应用程序

87,842

社区成员

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧