I'd created checkDay function for get value of input type text field and check value with if/else condition and give desire out through innerHTML to the target div #id.

Problem is I want to avoid all time to write "document.getElementById("showDay").innerHTML ". Is there a way to write simple code, which will perform same result?

working code - /

function checkDay()
{
    
    var a = document.getElementById("enterNumber").value;  
    
    if (a==0)  //condition
    {
        alert("value of a is "+a);  //statements
        document.getElementById("showDay").innerHTML = "Enter value between 1-7";
    }
    
    if (a==1)  //condition
    {
        alert("value of a is "+a);  //statements
        document.getElementById("showDay").innerHTML = "Entered value is " + a + ", " + "Day is Monday";
    }
    
    else if (a==2)  //condition
    {
        alert("value of a is "+a);  //statements
        document.getElementById("showDay").innerHTML = "Entered value is " + a + ", " + "Day is Tuesday";
    }
    
    else if (a==3)  //condition
    {
        alert("value of a is "+a);  //statements
        document.getElementById("showDay").innerHTML = "Entered value is " + a + ", " + "Day is Wendesday";
    }
    
    else if (a==4)  //condition
    {
        alert("value of a is "+a);  //statements
        document.getElementById("showDay").innerHTML = "Entered value is " + a + ", " + "Day is Thursday";
    }
    
    else if (a==5)  //condition
    {
        alert("value of a is "+a);  //statements
        document.getElementById("showDay").innerHTML = "Entered value is " + a + ", " + "Day is Friday";
    }
    
    else if (a==6)  //condition
    {
        alert("value of a is "+a);  //statements
        document.getElementById("showDay").innerHTML = "Entered value is " + a + ", " + "Day is Saturday";
    }
    
    else if (a==7)  //condition
    {
        alert("value of a is "+a);  //statements
        document.getElementById("showDay").innerHTML = "Entered value is " + a + ", " + "Day is Sunday";
    }
    
    else
    {
        alert("Wrong value - Enter value between 1-7");  //statements
    }
    
}

<input type="text" id="enterNumber" name="" placeholder="Enter number for check value" />

<button onClick="checkDay();"> Check Value </button>

<br>
<div id="showDay"> </div>

I'd created checkDay function for get value of input type text field and check value with if/else condition and give desire out through innerHTML to the target div #id.

Problem is I want to avoid all time to write "document.getElementById("showDay").innerHTML ". Is there a way to write simple code, which will perform same result?

working code - http://jsfiddle/animatorstar/5chokg76/4/

function checkDay()
{
    
    var a = document.getElementById("enterNumber").value;  
    
    if (a==0)  //condition
    {
        alert("value of a is "+a);  //statements
        document.getElementById("showDay").innerHTML = "Enter value between 1-7";
    }
    
    if (a==1)  //condition
    {
        alert("value of a is "+a);  //statements
        document.getElementById("showDay").innerHTML = "Entered value is " + a + ", " + "Day is Monday";
    }
    
    else if (a==2)  //condition
    {
        alert("value of a is "+a);  //statements
        document.getElementById("showDay").innerHTML = "Entered value is " + a + ", " + "Day is Tuesday";
    }
    
    else if (a==3)  //condition
    {
        alert("value of a is "+a);  //statements
        document.getElementById("showDay").innerHTML = "Entered value is " + a + ", " + "Day is Wendesday";
    }
    
    else if (a==4)  //condition
    {
        alert("value of a is "+a);  //statements
        document.getElementById("showDay").innerHTML = "Entered value is " + a + ", " + "Day is Thursday";
    }
    
    else if (a==5)  //condition
    {
        alert("value of a is "+a);  //statements
        document.getElementById("showDay").innerHTML = "Entered value is " + a + ", " + "Day is Friday";
    }
    
    else if (a==6)  //condition
    {
        alert("value of a is "+a);  //statements
        document.getElementById("showDay").innerHTML = "Entered value is " + a + ", " + "Day is Saturday";
    }
    
    else if (a==7)  //condition
    {
        alert("value of a is "+a);  //statements
        document.getElementById("showDay").innerHTML = "Entered value is " + a + ", " + "Day is Sunday";
    }
    
    else
    {
        alert("Wrong value - Enter value between 1-7");  //statements
    }
    
}

<input type="text" id="enterNumber" name="" placeholder="Enter number for check value" />

<button onClick="checkDay();"> Check Value </button>

<br>
<div id="showDay"> </div>

• javascript
• html

3 Answers 3

Use something like this

function checkDay()
{
    var a = document.getElementById("enterNumber").value;  

    var days = ["Mon", "Tue", "Wed","Thur", "Fri","Sat","Sun"];
    if (a > 0 and a < 8) {
        document.getElementById("showDay").innerHTML = 
           "Entered value is " + a + ", " + "Day is "+ days[a-1];
    } else
    {
        alert("Wrong value - Enter value between 1-7");  //statements
    }
}

My own take on this would be to use two simple functions; the first to reduce the typing of document.getElementById() repeatedly, though this advantage was obviated by the omission of multiple if tests. The second simply returns a day from the array, using index-1 syntax, since you were using 1-7 and JavaScript uses zero-based indexes:

function gid(id) {
  return document.getElementById(id);
}

function dayFromInt(n) {
  return ['monday', 'tuesday', 'wednesday', 'thursday', 'friday', 'saturday', 'sunday'][n - 1];
}

function checkDay() {

  var a = document.getElementById("enterNumber").value;
  if (a > 0 && a < 8) {
    gid('showDay').textContent = 'Entered value is: ' + a + '; Day is: ' + dayFromInt(a);
  } else {
    gid('showDay').textContent = 'Pick a day, by number, from 1-7';
  }

}

<input type="text" id="enterNumber" name="" placeholder="Enter number for check value" />

<button onClick="checkDay();">Check Value</button>

<br>
<div id="showDay"></div>

You could use an array to store the days.

var days = new Array("mon","tue","wed","thur","fri","sat","sn");

And then, simply use,

if(a>=1 && a<=7)
    document.getElementById("showDay").innerHTML = "Entered value is " + a + ", " + "Day is "+ days[a-1];
else
    alert("Wrong value - Enter value between 1-7");