如何在变量var a中设置动态数据并渲染到id为view的div容器中
实现方案
你现有代码存在3个核心问题,修正后即可正常渲染:
- 变量作用域错误:
a在forEach循环内部声明,循环外无法访问,且每次循环会直接覆盖变量,无法累加所有列表项内容 - 字符串拼接语法错误:两处缺少
+拼接符,运行时会直接抛出语法错误 - 无内容累加逻辑:每次循环都是给
a赋新值,不会保留之前拼接的条目内容
修正后可运行代码
$.ajax({ url: '你的实际接口地址', method: 'get', dataType: "json", success: function (data) { // 先在外层初始化空字符串用于拼接 var a = ""; data.forEach(function(elem){ // 补全拼接符,每次循环追加内容,加<br>实现每条数据换行 a += "ID: " + elem.id + "<b>" + elem.name + "</b><br>"; }) $('#view').html(a); }, // 可选:添加请求失败处理逻辑,避免接口报错时无反馈 error: function() { $('#view').html('数据加载失败,请稍后重试'); } });
可选优化写法(ES6模板字符串,语法更简洁不容易写错拼接符)
$.ajax({ url: '你的实际接口地址', method: 'get', dataType: "json", success: function (data) { var a = ""; data.forEach(function(elem){ a += `ID: ${elem.id}<b>${elem.name}</b><br>`; }) $('#view').html(a); }, error: function() { $('#view').html('数据加载失败,请稍后重试'); } });
内容的提问来源于stack exchange,提问作者Boris
相关产品推荐
相关产品推荐

