Question

我对javascript和jquery都很陌生，并且遇到了一个小项目的问题。

我的javascript代码中有一个for循环，它应该append一个新的<div>到一个已经存在于DOM中的东西，为了保持它唯一，它的id附加了id它应该代表的对象。但是，我不完全确定如何将此变量插入<div>声明中。有人可以帮我解决这个问题吗？

这是代码块：

var progressdiv_id = 'progressdiv' + data[ i ][ 'active_report_thread' ][ 'thread_id' ];
var progressbar_id = 'progressbar' + data[ i ][ 'active_report_thread' ][ 'thread_id' ];
var progressbar_style = 'width: ' + data[ i ][ 'active_report_thread' ][ 'progress' ] + '%';
$( '#progressbars' ).append( '<div class="row"><div id=progressdiv_id class="progress progress-striped active span6"><div id=progressbar_id class="bar" style=progressbar_style></div></div></div>' );

我试图将变量名称插入到<div>声明中，但它似乎不起作用。

谢谢！

Answer 1

有几种方法可以解决这个问题。但是，要切入追逐：

var progressdiv_id = 'progressdiv' + data[ i ][ 'active_report_thread' ][ 'thread_id' ];
var progressbar_id = 'progressbar' + data[ i ][ 'active_report_thread' ][ 'thread_id' ];
var progressbar_style = 'width: ' + data[ i ][ 'active_report_thread' ][ 'progress' ] + '%';
$( '#progressbars' ).append( '<div class="row"><div id="'+progressdiv_id+'" class="progress progress-striped active span6"><div id="'+progressbar_id+'" class="bar" style="'+progressbar_style+'"></div></div></div>' );

Javascript没有＆＃34; native＆＃34;处理字符串插值的方法;这是您需要处理您提供的语法类型。相反，您必须将变量连接到字符串。我可能会创建并缓存一些jQuery对象，并且只在循环的每次迭代中操作我需要的部分，并将它们全部追加到最后。或者，使用riot.js之类的模板引擎来帮助您。

Answer 2

在jQuery中，您可以传递这样的属性来创建div或HTML元素;

jQuery('<div/>', {
id: 'progressdiv_id',
href: 'http://here if it is an anchor',
title: 'some title',
text: 'some text'
}).appendTo('#TargetDiv');

您也可以使用.html()代替.append()来插入目标元素

使用+运算符组合字符串（串联），同样适用于被视为容器的变量并保存任何类型的数据（字符串或数字），因此将变量与字符串组合时是相同的加入两个字符串

jquery - 将变量插入DOM属性声明中

2 个答案: