javascript - 如何使用 JavaScript 将 `aria-disabled` 设置为 true

Question

我对JS一无所知。但是我的 Ruby 中需要一行代码。我有以下html。

<div class="ui-dialog-buttonpane ui-widget-content ui-helper-clearfix">
   <div class="ui-dialog-buttonset">
      <button class="otherButtonClass ui-state-hover ui-state-focus" type="button" role="button" aria-disabled="false">
      <button class="otherButtonClass" type="button" role="button" aria-disabled="false" style="display: none;">
      <button class="cancelButtonClass" type="button" role="button" aria-disabled="false">
   </div>
</div>

我希望 JS 代码使第一个和第二个按钮使它们可见。代码是什么？

请帮忙。

Answer 1

http://jsfiddle.net/SQ7SH/1/

var buttons = document.querySelectorAll('.ui-dialog-buttonset button');
    buttons[0].setAttribute('aria-disabled', true);
    buttons[1].setAttribute('aria-disabled', true);

Also button require close tag

Answer 2

var buttons = document.getElementsByClassName('otherButtonClass');
for(var i = 0; i < buttons.length; i++){
    buttons[i].setAttribute('aria-disabled', 'true');
}

Answer 3

如问there is needed one line of code：

document.querySelectorAll('.ui-dialog-buttonset .otherButtonClass').forEach(function (item) {item.setAttribute('aria-disabled', true);});

Answer 4

当前设置aria-属性的方法是直接引用属性。

要得到：

let el = document.getElementById('foobar');
console.log(el.ariaDisabled); // Should log the current value of aria-disabled.

设置：

let el = document.getElementById('foobar');
el.ariaDisabled = 'true';
console.log(el.ariaDisabled); // Should log 'true'.

参考：Element.ariaDisabled MDN