# How to Make Positive Number Negative in Javascript

In this tutorial, you will learn how to make positive number negative in javascript. Without numbers, it is challenging to calculate anything. A number is created by adding together the digits 0 through 9. For a newbie developer, it can be a bit tricky to make positive number negative.

There are numerous ways to make positive number negative. But for the sake of simplicity, we will make use of  `Math` object.  This object contains a lot of methods and properties which can help us in various mathematical operations. One of those methods is the `abs()` method.

The `abs()` method returns an absolute value of a number. The absolute value of a number can be calculated by calculating its distance from zero on the number line, regardless of the direction. The value that remains after a number loses any earlier negative sign is known as the absolute value. The absolute value of -5 is 5.

In the following example, we have an input field in which we will enter a random number. Upon click of a button, we will make positive number negative and display that on the screen.  Please have a look over the code example and the steps given below.

HTML & CSS

• We have 4 elements in the HTML file (`div``input``button`, and `h1`). The `div` element is just a wrapper for the rest of the elements.
• The `innerText` for the `button` element is `“Get”` and for the `h1` element, it is `“Result”`.
• We have done some basic styling using CSS and added the link to our `style.css` stylesheet inside the `head` element.
• We have also included our javascript file `script.js` with a `script` tag at the bottom.
```<!DOCTYPE html>
<html lang="en">

<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>

<body>

<div class="container">
<input type="number" placeholder="Enter Number">
<button>Get</button>
<h1>Result</h1>
</div>

<script src="script.js"></script>
</body>

</html>```
```.container {
text-align: center;
}

button {
margin-top: 10px;
}

input {
display: block;
margin: 10px auto;
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
-webkit-appearance: none;
margin: 0;
}```

Javascript

• We have selected the `input` element, `button` element, and `h1` element using the `document.querySelector()` method and stored them in `input``btnGet`, and `output` variables respectively.
• We have attached a `click` event listener to the `button` element.
• In the event handler function, we are storing the value of the `input` element in the `num` variable.
• We are calling the `abs()` method to get the absolute of `num` and we are prefixing it with negative sign.  We are storing the number in the `result` variable.
• We are displaying the `result` in the `h1` element using the `innerText` property.
```let input = document.querySelector("input");
let btnGet = document.querySelector("button");
let output = document.querySelector("h1");