By using this site, you agree to the Privacy Policy and Terms of Use.
Accept
rocoderesrocoderes
  • Home
  • HTML & CSS
    • Login and Registration Form
    • Card Design
    • Loader
  • JavaScript
  • Python
  • Internet
  • Landing Pages
  • Tools
    • Google Drive Direct Download Link Generator
    • Word Count
  • Games
    • House Painter
Notification Show More
Latest News
How to set the dropdown value by clicking on a table row
Javascript – How to set the dropdown value by clicking on a table row
JavaScript
Attempting to increase the counter, when the object's tag exist
Javascript – Attempting to increase the counter, when the object’s tag exist
JavaScript
Cycle2 JS center active slide
Javascript – Cycle2 JS center active slide
JavaScript
Can import all THREE.js post processing modules as ES6 modules except OutputPass
Javascript – Can import all THREE.js post processing modules as ES6 modules except OutputPass
JavaScript
How to return closest match for an array in Google Sheets Appscript
Javascript – How to return closest match for an array in Google Sheets Appscript
JavaScript
Aa
Aa
rocoderesrocoderes
Search
  • Home
  • HTML & CSS
    • Login and Registration Form
    • Card Design
    • Loader
  • JavaScript
  • Python
  • Internet
  • Landing Pages
  • Tools
    • Google Drive Direct Download Link Generator
    • Word Count
  • Games
    • House Painter
Follow US
High Quality Design Resources for Free.
rocoderes > JavaScript Program > How to Check If a Number is Positive, Negative, or Zero
JavaScript Program

How to Check If a Number is Positive, Negative, or Zero

Rocoderes
Last updated: 2022/08/30 at 3:49 PM
Rocoderes
Share
3 Min Read
How to Check If a Number is Positive, Negative, or Zero

In this article, we will make a program to check if a number is positive, negative, or zero. We will have an input field to get user input, and a button with functionality to check the nature of the number. We will add this functionality using JavaScript. This will be very easy to program and also beginner-friendly. So we will try to learn these programs with easier explanation. So let’s create these programs one by one.

Contents
Creating HTML ElementsAdding Functionality Using JSOutput

Creating HTML Elements

First of all, we have created an HTML markup, in this we have added an input field with number type, and we gave “data” as ID. Then we have added a button on which we have applied onclick event listener which listens the click event on the button, we also gave a function which will run when the click event fires. After that, we have added a <h1> heading with “res” ID.

Lastly, we have added main.js file path as our source for JavaScript code. We are here using external JS, so we just need to provide file path in src attribute.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Addimg two numbers</title>
</head>
<body>
    <input type="number" id="data" step="any"/>
    <button onclick="check()">Check</button>
    <h1 id = "res"></h1>
    <script src="main.js"></script>
</body>
</html>

Adding Functionality Using JS

In JS file, we have created a function check() which we have called in the button. In this function, we have fetched the value of the input field into the value variable using document.getElementById('data').value. Here, we are targeting the input field with its ID “data” using this document.getElementById('data') method.

Now we are using Math.sign() method, this method is used to check the nature of the value. This will return corresponding values, like for negative value we get -1, for zero we get 0, and for positive value we will get 1. Now we have added conditions for these values came from Math.sign() method. For Positive value, If the result greater than 0 then we add a string which says it is positive. Else if result less than 0 then we add a string which says it is negative. Else, if the result is 0 then we add a string which says it is zero.

Lastly, we need to add the result string using document.getElementById('res').innerText = `${result}`, here we have targeted <h1> tag using res id and added result using innerText attribute.

function check(){
    var value = document.getElementById('data').value;
    var result = Math.sign(value);

    if(result>0){
        result= `${value} is a positive number`; 
    }
    else if(result<0){
        result= `${value} is a negetive number`; 
    }
    else{
        result= `${value} is zero`; 
    }

    document.getElementById('res').innerText = `${result}`;
}

Output

How to Check If a Number is Positive, Negative, or Zero
How to Check If a Number is Positive, Negative, or Zero
How to Check If a Number is Positive, Negative, or Zero

Related

Subscribe to Our Newsletter

Subscribe to our newsletter to get our newest articles instantly!

TAGGED: programs
Share this Article
Facebook Twitter Email Print
What do you think?
Love0
Sad0
Happy0
Sleepy0
Angry0
Dead0
Wink0
Posted by Rocoderes
Rocoderes is a blog you can learn HTML, CSS, JavaScript, React Js and Python along with creative coding stuff and free source code files.
Previous Article How to Convert Kilometers to Miles and Celsius to Fahrenheit How to Convert Kilometers to Miles and Celsius to Fahrenheit
Next Article Write a Proram to Generate a Random Number in JavaScript Write a Proram to Generate a Random Number in JavaScript
1 Comment 1 Comment
  • Pingback: How to Swap Two Numbers Without A Third Variable in JS - rocoderes

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

- Advertisement -

You Might Also Like

Computing Fibonacci Sequence in JavaScript

Computing Fibonacci Sequence in JavaScript

January 12, 2023
Swap Two Numbers Without A Third Variable

How to Swap Two Numbers Without A Third Variable in JS

December 12, 2022
Armstrong Number

How to Find an Armstrong Number Using JavaScript

September 23, 2022
Print The Table

How to Print The Table of Any User Defined Number Using Function

September 22, 2022
rocoderesrocoderes
Follow US

Copyright © 2022 All Right Reserved By Rocoderes

  • Home
  • About us
  • Contact us
  • Disclaimer
Join Us!

Subscribe to our newsletter and never miss our latest news, podcasts etc.

Zero spam, Unsubscribe at any time.
Welcome Back!

Sign in to your account

Lost your password?