javascript - 在控制台面板中编辑HTML时，没有setAttribute或getAttribute

This question already has answers here:

What do querySelectorAll and getElementsBy* methods return?
                                
                                    （9个答案）
                                
                        
                                2年前关闭。
            
                    
我想尝试在Chrome的控制台面板中设置属性。

但无需使用鼠标。像这样的例子：
https://developers.google.com/web/updates/2015/08/edit-html-in-the-console-panel

我只想用命令编写JS-CODE，例如：

document.querySelectorAll(".serial-number").setAttribute("Value","dummy");

在控制台面板Chrome中，此功能setAttribute不可用。请问是否有其他方法可以通过设置属性来编写CODE？

最佳答案

document.querySelectorAll返回一个静态nodelist，因此需要迭代该集合以提供对元素的访问权限。然后setAttribute可用于设置属性

var getAllLI = document.querySelectorAll('.demoClass');
getAllLI.forEach(function(item, index) {
  item.setAttribute('value', index)
})

<input class="demoClass">
<input class="demoClass">
<input class="demoClass">
<input class="demoClass">

关于javascript - 在控制台面板中编辑HTML时，没有setAttribute或getAttribute ，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/49282443/