How to Use Sweet Alert in JavaScript?

Estimated read time 1 min read

SweetAlert is a popular JavaScript library for creating alerts and confirmations with a sweet and friendly interface. To use SweetAlert, you’ll need to include the library in your HTML file. You can do this by downloading the library from the SweetAlert website or by linking to it from a CDN.

Here is an example of how to create a simple SweetAlert alert:

<script src="https://cdn.jsdelivr.net/npm/sweetalert2@10"></script>

<script>
  const alertButton = document.getElementById('alert-button');

  alertButton.addEventListener('click', function () {
    Swal.fire({
      title: 'Title of the alert',
      text: 'This is the text of the alert',
      icon: 'success'
    });
  });
</script>

In this example, the SweetAlert library is linked from a CDN. Then, an event listener is added to an element with an ID of alert-button. When the button is clicked, SweetAlert will display a alert with the specified title, text, and icon.

There are many other options available for customizing the look and behavior of SweetAlert alerts, including options for buttons, input fields, and callbacks. You can find more information and examples in the SweetAlert documentation.

You May Also Like

More From Author

+ There are no comments

Add yours

Leave a Reply