HTML DOM Input URL defaultValue Property

HTML Web Development Front End Technology

The HTML DOM Input URL defaultValue property sets/returns the default value corresponding to URL Input. The value attribute changes as the user types in the URL input but default value does not change.

Syntax

Following is the syntax −

Returning string value

inputURLObject.defaultValue

Setting defaultValue to string

inputURLObject.defaultValue = ‘string’

Example

Let us see an example of Input URL defaultValue property −

Live Demo

<!DOCTYPE html>
<html>
<head>
<title>Input URL defaultValue</title>
<style>
   form {
      width:70%;
      margin: 0 auto;
      text-align: center;
   }
   * {
      padding: 2px;
      margin:5px;
   }
   input[type="button"] {
      border-radius: 10px;
   }
</style>
</head>
<body>
<form>
<fieldset>
<legend>URL-defaultValue</legend>
<label for="URLSelect">URL :
<input type="url" id="URLSelect" size="25" value="https://www.google.com">
</label>
<input type="button" onclick="getDefaultValue()" value="Reset Default Value">
<div id="divDisplay"></div>
</fieldset>
</form>
<script>
   var divDisplay = document.getElementById("divDisplay");
   var inputURL = document.getElementById("URLSelect");
   divDisplay.textContent = 'defaultValue: '+inputURL.defaultValue;
   function getDefaultValue() {
      var currentValue = inputURL.value;
      divDisplay.textContent = 'Value - '+inputURL.value+' resets to - '+inputURL.defaultValue;
      inputURL.value = inputURL.defaultValue;
   }
</script>
</body>
</html>

Output

This will produce the following output −

Before clicking ‘Reset Default Value’ button −

After clicking ‘Reset Default Value’ button with changed URL −

AmitDiwan

Published on 26-Jul-2019 12:01:30

Previous Page Print Page