Question

我试图通过仅引用父对象来学习如何更改对象。在这种情况下，我需要三个按钮;一个是另外两个的父母。当我单击父按钮时，两个孩子上的文本应该更改。在jsFiddle中尝试这个，我有：

<body>

<button class="parent" id="btn1">Parent button
  <button class="child" id="childbtn1">child 1</button>
  <button class="child" id="childbtn2">child 2</button>
</button>

</body>

使用js：

document.getElementByClassName("parent").addEventListener('click',  
function() {
    $("btn1.child").innerHTML="new text";
});

我看过similar posts，但对我而言，必须使用相关按钮的要求让我失望。如果按钮元素设置正确（我不知道它们是否存在），我应该通过id或类来获取元素来改变孩子吗？感谢。

Answer 1

您无法将按钮放在按钮内。如果打开检查模式，您会注意到子项从父按钮中弹出。所以，如果你要将它们改为div，那就行了。另外，我将您的代码转换为jQuery，因为您将问题标记为jQuery。

＆＃13;

$(".parent").click(function () {
  $(this).find(".child").html("new text");
});

＆＃13;

div {
  padding:30px;
  cursor:pointer;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="parent" id="btn1">Parent button
  <div class="child" id="childbtn1">child 1</div>
  <div class="child" id="childbtn2">child 2</div>
</div>

＆＃13;

用父按钮更改子按钮

1 个答案: