如何更改具有数据属性的特定div的内容？

Question

我想知道如何更改具有数据属性的特定div的内容。

我正在使用click事件和.html

我有很多div元素，如下所示：

<div class"name-of-class" data-user-id="ID">Content that changes</div>

我已经有了ID变量来标识我需要更改的div

$('.name-of-class').click( function() {
  $('.name-of-class').html('new content');
}

因此，我想在click函数中使用数据属性data-user-id来确切指定我需要更改的div。

我希望我能使自己变得清晰，否则，我会尽力向自己解释。

Answer 1

您可以使用属性等于选择器[name =“ value”] 。

$('.name-of-class').click( function() {
  $('[data-user-id="id"]').html('new content');
}

根据评论进行编辑以传递变量

$('.name-of-class').click( function() {
  $('[data-user-id="'+ idVariable +'"]').html('new content');
}

Answer 2

您可以使用属性等于选择器[name =“ value”]

$('.name-of-class').click( function() {
  $('.name-of-class[data-user-id="id"]').html('new content');
}

编辑

根据评论

$('.name-of-class').click( function() {
  $('.name-of-class[data-user-id="' + useridvariable +'"]').html('new content');
}

Answer 3

用这个：

HTML：

<div class="name-of-class" data-user-id="ID">Content that changes</div>

jQuery的：

$('.name-of-class').click( function() {
   $(this).html('new content');
});