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 动态数据：贴心易感的网络应用程序

【ProgressBar】既进度条，当我们在做一些耗时操作的时候（例如下载文件），可以使用ProgressBar给用户提供一个进度提示，告诉用户当前的进度。 ProgressBar.js 是一个借助动态 SVG 路径的漂亮的，响应式的进度条效果。使用 ProgressBar.js 可以很容易地创建任意形状的进度条。这个 JavaScript 库提供线条，圆形和方形等几个内置的形状，但你可使用 Illustrator 或任何其它的矢量图形编辑器创建自己的进度条效果。

js动态添加删除成员列表

实现动态创建列表获取元素的六种方式创建元素的三种方式

动态创建列表版本一 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta ht...