JavaScript "если X", то содержание условия заменить

Question

я пытаюсь редактировать содержимое магазина без редактирования HTML (код закрыт для изданий, я могу добавить только некоторые JS или CSS. Есть div:

<div class="product_section" id="projector_shipping_info" style=""><label>
Ready to send</label><div><span class="projector_delivery_days" 
id="projector_delivery_days" style="display: inline;">in 21 days   </span> 
</div><a class="shipping_info" href="#shipping_info" title="Check time and price"> Check time and price</a></div>

Я пытаюсь сделать "если«Заявление о замене жесткого» в течение 21 дня, «время доставки», в «от 3 до 10 дней». Мне нужно использовать IF, потому что время доставки является одним из трех возможных состояний: 21 день, 9 дней и 3 дня.изменить его на «от 3 до 10 дней», «2-4 дня» и «1-2 дня».

Я уже тестировал (и это сработало)

document.getElementById('projector_delivery_days').innerHTML = '';
var p = document.createElement('p');
p.innerHTML = "Shipping in 3-5 days";
document.getElementById('projector_shipping_info').appendChild(p);

Но он статический. Хочу сделать IF из этого. Я пробовал

document.body.onload=function(){ var
div1=document.getElementsById('projector_delivery_days')[0];  
if(div1.innerHTML=="in 21 days   "){
document.getElementsById('projector_delivery_days')[0].innerHTML="in 3 to 10 days   ";   }    }

Но, похоже, ничего не делает, то же самое относится и к

function shipping(){
var d1 = document.getElementById('projector_delivery_days');
  if(d1.innerHTML==='in 21 days   '){
  d1.innerHTML='in 3 to 10 days   ';
  document.getElementById('projector_shipping_info').appendChild(d1);
  }
};

Я былборясь с этим в течение 2-3 дней. Может кто-нибудь отправить помощь?

Answer 1

Селектор - document.getElementById, а не getElementsById.Он возвращает первый найденный элемент с этим идентификатором, а не массивом, поэтому нет смысла выбирать элементы массива с помощью [0]

document.body.onload = function() {
  var div1 = document.getElementById('projector_delivery_days');
  if (div1.textContent == "in 21 days   ") {
    console.log(div1.textContent)
    document.getElementById('projector_delivery_days').innerHTML = "in 3 to 10 days";
  }
}

<div class="product_section" id="projector_shipping_info" style=""><label>
Ready to send</label>
  <div><span class="projector_delivery_days" id="projector_delivery_days" style="display: inline;">in 21 days   </span>
  </div><a class="shipping_info" href="#shipping_info" title="Check time and price"> Check time and price</a></div>

Во втором фрагменте функция никуда не вызывается.Вы должны вызвать функцию при загрузке окна, чтобы заменить текст

window.onload=function shipping(){
var d1 = document.getElementById('projector_delivery_days');
  if(d1.innerHTML==='in 21 days   '){
  d1.textContent='in 3 to 10 days   ';
  document.getElementById('projector_shipping_info').appendChild(d1);
  }
};

<div class="product_section" id="projector_shipping_info" style=""><label>
Ready to send</label>
  <div><span class="projector_delivery_days" id="projector_delivery_days" style="display: inline;">in 21 days   </span>
  </div><a class="shipping_info" href="#shipping_info" title="Check time and price"> Check time and price</a></div>