如何使用javaScript获取特定元素？

我正在尝试使用

JavaScript

更改按钮的

背景颜色。
这是我的按钮：

<button type="submit" class="btn btn-primary  btn-responsive btnVotePost" name="Approve" value="Approve" id="btnApprove{{post.postId}}" data-post-id="{{post.postId}}" onclick="approveClicked()">Approuver</button>

那么如何获取
数据发布id的值呢？
Javascript是区分大小写的<代码>功能
与
功能
不同
ApproveClicked
也与
ApproveClicked
不同。这是从当前元素获取数据的最简单方法：


功能已批准点击（obj）{
console.log（obj.dataset.postId）；
//然后，您可以通过id获得另一个元素（不推荐，因为有更好的解决方案，不会用id污染DOM，如1、2、3…）：
//document.getElementById（obj.dataset.postId）.style.backgroundColor='green'；
}
approver
您可以通过以下方式实现它。此外，您在类型问题上也犯了一些错误，例如您编写了
函数
它应该
函数
，函数名称也与您在按钮属性
approveClicked
中编写的声明不匹配，但您在声明中编写了
approveClicked

<button type="submit" class="btn btn-primary  btn-responsive btnVotePost" name="Approve" value="Approve" id="btnApprove{{post.postId}}" data-post-id="{{post.postId}}" onclick="approveClicked(this)">Approuver</button>

function approveClicked(self){
  var x = self.getAttribute("data-post-id")
}

approver
已批准的功能（自身）{
var x=self.getAttribute（“数据发布id”）
}
为什么不使用外部事件处理程序并使用
此
引用，这样就不必使用不可靠的CSS选择器？不，文档没有该属性。在获取该元素的数据属性之前，需要该元素。您正在尝试根据ID查找元素吗？或者您只是想访问在其单击处理程序（此处名称错误）中单击的元素？动态ID有点不好。
<button type="submit" class="btn btn-primary  btn-responsive btnVotePost" name="Approve" value="Approve" id="btnApprove{{post.postId}}" data-post-id="{{post.postId}}" onclick="approveClicked(this)">Approuver</button>

function approveClicked(self){
  var x = self.getAttribute("data-post-id")
}