Author: John Au-Yeung

Sometimes, we want to get margin value of a div in plain JavaScript.

In this article, we’ll look at how to get margin value of a div in plain JavaScript.

How to get margin value of a div in plain JavaScript?

To get margin value of a div in plain JavaScript, we use the getComputedStyle method.

For instance, we write

const p = document.getElementById("target");
const style = window.getComputedStyle(p);

console.log(style.marginTop);

to select the element we want to get the margin for with getElementById.

Then we call getComputedStyle with p to return an object with the computed styles.

And then we get the margin top value with style.marginTop in pixels.

Conclusion

To get margin value of a div in plain JavaScript, we use the getComputedStyle method.

Sometimes, we want to auto start print HTML page using JavaScript.

In this article, we’ll look at how to auto start print HTML page using JavaScript.

How to auto start print HTML page using JavaScript?

To auto start print HTML page using JavaScript, we call print when the page is loaded.

For instance, we write

window.onload = () => {
  window.print();
};

to set window.onload to a function that’s called when the page finishes loading.

In it, we call window.print to open the print dialog.

Conclusion

To auto start print HTML page using JavaScript, we call print when the page is loaded.

Sometimes, we want to block users from closing a window in JavaScript.

In this article, we’ll look at how to block users from closing a window in JavaScript.

How to block users from closing a window in JavaScript?

To block users from closing a window in JavaScript, we can watch the beforeunload event.

For instance, we write

window.onbeforeunload = () => {
  return "";
};

to set window.onbeforeunload to a function that’s called when the beforeunload event.

The beforeunload event is triggered when we close the window.

An alert box will show when we close the tab if we have an event listener for the beforeunload event.

Conclusion

To block users from closing a window in JavaScript, we can watch the beforeunload event.

Sometimes, we want to convert Firebase timestamp to date and time with JavaScript.

In this article, we’ll look at how to convert Firebase timestamp to date and time with JavaScript.

How to convert Firebase timestamp to date and time with JavaScript?

To convert Firebase timestamp to date and time with JavaScript, we use the Date constructor.

For instance, we write

const timestamp = { nanoseconds: 0, seconds: 1562524200 };

console.log(new Date(timestamp.seconds * 1000));

We convert seconds to milliseconds by multiplying it by 1000.

Then we pass it into the Date constructor to convert it into a Date object.

Conclusion

To convert Firebase timestamp to date and time with JavaScript, we use the Date constructor.