перевести JQuery на чистый JavaScript

Question

Мне нужно исправить проверку формы, но на странице хоста нет jQuery. Я бы обычно делал что-то подобное ...

if ($("#contactNameAdd").val() !== '' || $("#contactPhoneAdd").val() !== '') {
    $("#contactForm").show()
};

Как мне переписать это в обычном js?

Answer 1

var name = document.getElementById("contactNameAdd");
var phone = document.getElementById("contactPhoneAdd");
var form = document.getElementById("contactForm");

if(name.value != '' || phone.value != '') {
   form.style.display = "block";
}

Answer 2

if (document.getElementById('contactNameAdd').value !== '' || document.getElementById('contactPhoneAdd').value !== '') {
    document.getElementById('contactForm').style.display = 'block';
}

В простом javascript вы используете document.getElementById ('id') , чтобы получить DOM-узлы на основе атрибута id.Вы используете .value для элемента ввода DOM, чтобы получить его значение.И вы используете .style на любом элементе DOM для установки атрибутов css.В этом случае «шоу» означает «показ: блок;».

Answer 3

var contactName = document.getElementById('contactNameAdd');
var contactPhone = document.getElementById('contactPhoneAdd');
if(contactName.value !== '' || contactPhone.value !== '') {
  // Different as JQuery, there will be no animation.
  // I assume you use 'display:none' to hide the form.
  var form = document.getElementById('contactForm');
  form.style.display = 'block';
}

Answer 4

Это должно сработать.

var contactNameAdd = document.getElementById("contactNameAdd");
var contactPhoneAdd = document.getElementById("contactPhoneAdd");

if((contactNameAdd !== null && contactNameAdd.value !== '') || (contactPhoneAdd !== null && contactPhoneAdd.value !== ''))
{
    document.getElementById("contactForm").style.display = 'block';
}

Answer 5

if (document.getElemenById('contactNameAdd').value != '' || document.getElementById('contactPhoneAdd').value != '') {
    document.getElementById('contactForm').style.display = 'block';
}

Попробуйте это - проверяет 2 значения, затем изменяет свойство style.display для contactForm