主页 / 问题 / 1232103
Accepted
Влад
Asked:2022-01-16 15:21:01 +0000 UTC2022-01-16 15:21:01 +0000 UTC

使用 for 循环

  • 772

页面上有一个元素表，需要在某个地方添加一个按钮，下面是脚本代码：

var input = document.getElementsByClassName('address')[0].innerText;
var button = document.getElementsByClassName('order')[0].getElementsByTagName('td')[4];
var a = document.createElement('a');
var linkText = document.createTextNode('Геолокация');
a.appendChild(linkText);
a.target = "_blank";
a.className = "grey";
a.href = "https://yandex.ru/maps/?text=Город, " + input;
button.appendChild(a);

代码可以工作，但是它只在第一个元素（'order'）[0]上添加了一个按钮，而且数量很多，件[100]，td[4]是常数，为每个元素编写自己的代码('order') 不知何故不在风水中，是否可以通过 for 循环组织这个过程？('address')[0] 和 ('order')[0] 是有序的，所以当 ('address')[1] 时 ('order')[1] 也是如此。

javascript

1 个回答

  1. Best Answer

    let addresses = document.getElementsByClassName('address');
let orders = document.getElementsByClassName('order');

Array.from(addresses).forEach((el, index) => {
    let address = addresses[index].innerText;
    let order =  orders[index].getElementsByTagName('td')[4];
    let a = document.createElement('a');
    let linkText = document.createTextNode('Геолокация');
    
    a.appendChild(linkText);
    a.target = "_blank";
    a.className = "grey";
    a.href = "https://yandex.ru/maps/?text=Город, " + address;
    order.appendChild(a);       
});
    <div class="address">text 1</div>
<div class="order">order 1 
<table><tr><td></td><td></td><td></td><td></td><td>1</td></tr></table>
</div>

<div class="address">text 2</div>
<div class="order">order 2
<table><tr><td></td><td></td><td></td><td></td><td>2</td></tr></table>
</div>

<div class="address">text 3</div>
<div class="order">order 3
<table><tr><td></td><td></td><td></td><td></td><td>3</td></tr></table>
</div>

    但最好直接依赖您在问题中未提供的 html。

    • 1

相关问题