Category: JavaScript Answers

Sometimes, we want to execute function after complete page load with JavaScript.

In this article, we’ll look at how to execute function after complete page load with JavaScript.

How to execute function after complete page load with JavaScript?

To execute function after complete page load with JavaScript, we listen to the readystatechange event.

For instance, we write

document.addEventListener("readystatechange", (event) => {
  if (event.target.readyState === "interactive") {
    console.log("hi");
  }

  if (event.target.readyState === "complete") {
    console.log("hi 2");
  }
});

to listen to the document‘s readystatechange event with addEventListener.

In the event listener callback, we get the document‘s readyState with event.target.readyState.

If it’s 'interactive' then the page can be interacted with but it’s still loading.

And if the readyState is 'complete', then the page is completely loaded.

Conclusion

To execute function after complete page load with JavaScript, we listen to the readystatechange event.

Sometimes, we want to implement prepend and append elements with regular JavaScript.

In this article, we’ll look at how to implement prepend and append elements with regular JavaScript.

How to implement prepend and append elements with regular JavaScript?

To implement prepend and append elements with regular JavaScript, we use appendChild to append and insertBefore to prepend.

For instance, we write

const theParent = document.getElementById("theParent");
const theKid = document.createElement("div");
theKid.innerHTML = "Are we there yet?";

theParent.appendChild(theKid);
theParent.insertBefore(theKid, theParent.firstChild);

to get the theParent element and create the theKid element with createElement.

Then we call theParent.appendChild with theKid to append the theKid as the last child of theParent.

And we call theParent.insertBefore with theKid and theParent.firstChild to prepend theKid as the element before the first child element of theParent.

Conclusion

To implement prepend and append elements with regular JavaScript, we use appendChild to append and insertBefore to prepend.

Sometimes, we want to get value of a string after last slash in JavaScript.

In this article, we’ll look at how to get value of a string after last slash in JavaScript.

How to get value of a string after last slash in JavaScript?

To get value of a string after last slash in JavaScript, we can use the string lasrtIndexOf and substring methods.

For instance, we write

const str = "foo/bar/test.html";
const n = str.lastIndexOf("/");
const result = str.substring(n + 1);

to get the index of the last '/' in str with lastIndexOf. Then we call str.substring with n + 1 to return a substring from str from index n + 1 to the end of the str string.

Conclusion

To get value of a string after last slash in JavaScript, we can use the string lasrtIndexOf and substring methods.

Sometimes, we want to convert base64 string to ArrayBuffer with JavaScript.

In this article, we’ll look at how to convert base64 string to ArrayBuffer with JavaScript.

How to convert base64 string to ArrayBuffer with JavaScript?

To convert base64 string to ArrayBuffer with JavaScript, we can use the Uint8Array.from method.

For instance, we write

const b = Uint8Array.from(atob(base64String), (c) => c.charCodeAt(0));

to call Uint8Array.from with atob(base64String) and (c) => c.charCodeAt(0) to convert the base64String to an ArrayBuffer.

atob decodes the base64 string into an ASCII string.

charCodeAt returns the integer Unicode character code for the first character in each ASCII character string.

Conclusion

To convert base64 string to ArrayBuffer with JavaScript, we can use the Uint8Array.from method.

Sometimes, we want to convert string to title case with Lodash and JavaScript.

In this article, we’ll look at how to convert string to title case with Lodash and JavaScript.

How to convert string to title case with Lodash and JavaScript?

To convert string to title case with Lodash and JavaScript, we call the startCase function.

For instance, we write

const s = _.startCase(_.toLower(str));

to call startCase with a string to convert the _.toLower(str) lower case string to a title case string.

Conclusion

To convert string to title case with Lodash and JavaScript, we call the startCase function.