I would simply like to remove the attribute with my if condition and add it back with my else.

function onFocusChange () { 
  if (document.getElementById("input").focus()) { 
     document.getElementById("input").placeholder = "";
   else { 
     document.getElementById("input").placeholder = "This is Placeholder Text";   
   }
  }
}

mark-up:

<label for="input">
  Question #1:
</label>
<input type="text" id="input" name="Address" required="required" placeholder="This is Placeholder Text" />

I would simply like to remove the attribute with my if condition and add it back with my else.

function onFocusChange () { 
  if (document.getElementById("input").focus()) { 
     document.getElementById("input").placeholder = "";
   else { 
     document.getElementById("input").placeholder = "This is Placeholder Text";   
   }
  }
}

mark-up:

<label for="input">
  Question #1:
</label>
<input type="text" id="input" name="Address" required="required" placeholder="This is Placeholder Text" />

• javascript
• dom

• 1 "For demo purposes..." your question does not show any research effort. – tao Commented Jan 19, 2018 at 16:24
• 1 ... and this. – PM 77-1 Commented Jan 19, 2018 at 16:26
• 1 Why remove it when browser does it? – epascarello Commented Jan 19, 2018 at 16:31

2 Answers 2

To remove attribute you can use element.removeAttribute("placeholder");

You can use focus & blur event

var element = document.getElementById('input');
element.addEventListener('focus', function() {
  element.setAttribute('placeholder', '')

})

element.addEventListener('blur', function() {
  element.setAttribute('placeholder', 'This is Placeholder Text')

})

<label for="input">
  Question #1:
</label>
<input type="text" id="input" name="Address" required="required" placeholder="This is Placeholder Text" />