为什么我不能选择存储在变量中的属性值的所有元素？

Question

考虑以下HTML：

<div data-id=5>...</div>
<img data-id=5 src=...>
<input data-id=5 ...>
...

我需要选择并删除属性data-id等于5的所有元素。我的尝试：

var a = 5;
$('[data-id = a]').remove();

不起作用。为什么它不起作用，我该如何解决？

Answer 1

您的选择器使用错误。

试试这个：

while($row = sqlsrv_fetch_array($stmt, SQLSRV_FETCH_NUMERIC){

var a=5;
$('[data-id="'+a+'"]').remove();

Answer 2

那是因为你字面上选择"a"属性等于a的元素，因为它是字符串文字的一部分。 jQuery不知道字符串中的a引用变量 - 它无法知道，因为它是一个字符串 literal 。相反，指出$(`[data-id=${a}]`).remove() 是一个变量，并使用字符串连接或插值的值：

$('[data-id=' + a + ']').remove()

哪个是ES2015，或者是字符串连接（如果您的浏览器或环境不支持它），它在功能上是相同的，以及模板文字实际上是多少用于：

a

这将使用data-id中存储的值5来选择"a"属性为5而不是字面{{1}}的元素。

Answer 3

这是因为你正在发送＆＃34; a＆＃34;作为字符串文字，而不是变量。这是正确的方法：

＆＃13;

＆＃13;

var a = 5;
$('[data-id="' + a + '"]').remove();

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div data-id="5">...</div>
<input data-id="5" type="text" value="5"/>
<input data-id="4" type="text" value="4"/>

＆＃13;

＆＃13;

＆＃13;