var f = document.querySelector('.example');
var g = document.createElement('h2');
for (let i = 0; i < f.length; i ) {
g.innerHTML = f[i].innerHTML;
f[i].parentNode.replaceChild(g, f[i]);
}<ul>
<li class="example">Hi</li>
<li class="example">Hi</li>
<li class="example">Hi</li>
<li class="example">Hi</li>
<li class="example">Hi</li>
<li class="example">Hi</li>
<li class="example">Hi</li>
</ul>這是我想做的：
之后我想使用 JavaScript 對 WordPress 主題進行可訪問性調整。
在以下情況下，我想用標簽覆寫“.example”類的所有元素標簽<h2>（目前它們是<div>）
使用此處的代碼示例，我只能到達第一個元素（我知道），但我想用新標簽“覆寫”所有這些元素：
var f = document.querySelector('.example');
var g = document.createElement('h2');
g.innerHTML = f.innerHTML;
f.parentNode.replaceChild(g, f);
我該怎么做，我已經嘗試過類似的事情：
var f = document.querySelector('.example');
var g = document.createElement('h2');
for (let i = 0; i < f.length; i ) {
g.innerHTML = f[i].innerHTML;
f[i].parentNode.replaceChild(g, f);
}
但它不起作用。我認為這應該很簡單，但我是新手。
謝謝 ：）
uj5u.com熱心網友回復：
您需要<h2>每次通過回圈創建一個新元素，而不是重用相同的元素g。并且您需要使用document.querySelectorAll()來獲取所有.example元素，以便您可以遍歷它們。
var f = document.querySelectorAll('.example');
for (let i = 0; i < f.length; i ) {
var g = document.createElement('h2');
g.innerHTML = f[i].innerHTML;
f[i].parentNode.replaceChild(g, f[i]);
}<ul>
<li class="example">Hi</li>
<li class="example">Hi</li>
<li class="example">Hi</li>
<li class="example">Hi</li>
<li class="example">Hi</li>
<li class="example">Hi</li>
<li class="example">Hi</li>
</ul>轉載請註明出處，本文鏈接：https://www.uj5u.com/yidong/381103.html
標籤：javascript 数组 查询选择器
上一篇：React：將狀態傳遞給子組件
下一篇：使用“陣列路徑”從物件中獲取值