Author: John Au-Yeung

Sometimes, we want to open a PDF in a new browser full window with JavaScript.

In this article, we’ll look at how to open a PDF in a new browser full window with JavaScript.

How to open a PDF in a new browser full window with JavaScript?

To open a PDF in a new browser full window with JavaScript, we can call the window.open method with the PDF URL.

For instance, we write:

<a href="#" >open</a>

to add a link.

Then we write:

const a = document.querySelector('a')
a.onclick = () => {
  window.open('http://www.africau.edu/images/default/sample.pdf', '_blank', 'fullscreen=yes');
}

to select the anchor element with document.querySelector.

Then we set its onclick property that calls window.open to open the PDF URL in a new window.

'_blank' will make it open in a new window.

Conclusion

To open a PDF in a new browser full window with JavaScript, we can call the window.open method with the PDF URL.

Sometimes, we want to detect CSS variable support with JavaScript.

In this article, we’ll look at how to detect CSS variable support with JavaScript.

How to detect CSS variable support with JavaScript?

To detect CSS variable support with JavaScript, we can use the CSS.supports method.

For instance, we write:

console.log(CSS.supports('color', 'var(--fake-var)'))

to check if we can set the color CSS property to var(--fake-var).

If this returns true, then CSS variables is supported.

Conclusion

To detect CSS variable support with JavaScript, we can use the CSS.supports method.

Sometimes, we want to get the previous day with JavaScript.

In this article, we’ll look at how to get the previous day with JavaScript.

How to get the previous day with JavaScript?

To get the previous day with JavaScript, we can call setDate with the date minus 1.

For instance, we write:

const dateObj = new Date()
dateObj.setDate(dateObj.getDate() - 1);
console.log(dateObj)

We create a new Date instance and assigned it to dateObj.

Then we set the dateObj to the previous day by calling setDate with dateObj.getDate() - 1.

Conclusion

To get the previous day with JavaScript, we can call setDate with the date minus 1.

Sometimes, we want to check if any text input has value with JavaScript.

In this article, we’ll look at how to check if any text input has value with JavaScript.

How to check if any text input has value with JavaScript?

To check if any text input has value with JavaScript, we can use document.querySelectorAll to select all the inputs.

Then we can spread the node list into an array and use the array some method to check whether any element has a value set.

For instance, we write:

<input>
<input value='foo'>
<input>

to add some inputs.

Then we write:

const hasValue = [...document.querySelectorAll('input')]
  .some(el => el.value)
console.log(hasValue)

to select all the inputs with document.querySelectorAll.

Then we spread the node list into an array with the spread operator.

Then we call some to check whether any input has value set.

Therefore, hasValue should be true.

Conclusion

To check if any text input has value with JavaScript, we can use document.querySelectorAll to select all the inputs.

Then we can spread the node list into an array and use the array some method to check whether any element has a value set.

Sometimes, we want to count spaces before first character of a string with JavaScript.

In this article, we’ll look at how to count spaces before first character of a string with JavaScript.

How to count spaces before first character of a string with JavaScript?

To count spaces before first character of a string with JavaScript, we can use the JavaScript string’s search method.

For instance, we write:

const index = '    foo'.search(/\S/);
console.log(index)

We call search with a regex to match all non-whitespace characters.

Therefore, index is the index of first character that’s not a space.

index is 4, so any character before index 4 is a space, and so there’re 4 spaces before 'foo'.

Conclusion

To count spaces before first character of a string with JavaScript, we can use the JavaScript string’s search method.