如果要访问的ID存储在变量中，如何访问元素

Question

我试图动态创建元素，从而动态地为其赋予值。 因此，如果我想使用存储在变量中的值访问元素，该怎么做？

我试过使用$("#'"+g+"'")但是没有用

var text1 = '<div id="' + g + '"></div>';
var text2 = '<input data-checkbox="' + g + '" type="checkbox" style="display:none;"/><h3 data-header="' + g + '" style="display:inline-block;">Timer' + g + '  </h3><input data-input="' + g + '" type="text" style="display:none;"/>';
var text3 = '<span data-minutes="' + g + '">00</span>:<span data-seconds="' + g + '">00  </span><button data-start="' + g + '" >start</button><button data-stop="' + g + '" style="display:none;">stop</button><button data-clear="' + g + '" style="display:none;">clear</button>';
$('#header').append(text1);
$("#'"+g+"'").append(text2, text3);

Answer 1

这应该是您所需要的：

$("#" + g)

事实上，它是一个字符串。

Answer 2

您已经很接近正确了。 这些评论试图告诉您您没有正确形成选择器。

ID的选择器必须是以下形式的字符串：

'#id'

在您的示例中，您有太多的'符号，因此变量g的id将在字符串中，但被变量包围。 如果g是test-id ，则将具有以下字符串：

"#'test-id'"

...而jQuery无法与之匹敌。

您需要做的就是去掉那些引号，这看起来可能是这样：

 var g = 'any-id'; var text1 = '<div id="' + g + '"></div>'; var text2 = '<span>Some other text</span>'; $('#header').append(text1); $('#' + g).append(text2); 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div id="header">Header is here</div> 

Answer 3

您只是有一个小错误。

您需要这样尝试$("#"+g).append(text2, text3);

 var g = "data"; var text1 = '<div id="' + g + '"></div>'; var text2 = '<input data-checkbox="' + g + '" type="checkbox" style="display:none;"/><h3 data-header="' + g + '" style="display:inline-block;">Timer' + g + ' </h3><input data-input="' + g + '" type="text" style="display:none;"/>'; var text3 = '<span data-minutes="' + g + '">00</span>:<span data-seconds="' + g + '">00 </span><button data-start="' + g + '" >start</button><button data-stop="' + g + '" style="display:none;">stop</button><button data-clear="' + g + '" style="display:none;">clear</button>'; $('#header').append(text1); $("#"+g).append(text2, text3); 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div id="header"></div>