---
title: "Check if a PDF annotation has changed using JavaScript | Nutrient Web SDK"
canonical_url: "https://www.nutrient.io/guides/web/annotations/detecting-if-annotations-have-changed/"
md_url: "https://www.nutrient.io/guides/web/annotations/detecting-if-annotations-have-changed.md"
last_updated: "2026-05-15T19:10:05.076Z"
description: "Learn how to effectively detect changes in web annotations with our step-by-step guide. Enhance your content management and improve user experience."
---

# Detect changes in annotations

In addition to managing annotations with the [create, update, and delete APIs](https://www.nutrient.io/../../annotations/introduction-to-annotations/), we also provide events that let you intercept annotation changes made through the user interface (UI) or synced from the server.

| Event                        | Use case                                                                                 |
| ---------------------------- | ---------------------------------------------------------------------------------------- |
| [`annotations.load`](https://www.nutrient.io/api/web/NutrientViewer.Instance.html#~AnnotationsLoadEvent)       | Triggered when annotations are loaded from the document.                                 |
| [`annotations.willChange`](https://www.nutrient.io/api/web/NutrientViewer.Instance.html#~AnnotationsWillChangeEvent) | Triggered before a user modifies an annotation through the UI (for example, by drawing). |
| [`annotations.change`](https://www.nutrient.io/api/web/NutrientViewer.Instance.html#~AnnotationsChangeEvent)     | Triggered when annotations change due to a user action or API call.                      |
| [`annotations.create`](https://www.nutrient.io/api/web/NutrientViewer.Instance.html#~AnnotationsCreateEvent)     | Triggered when new annotations are created.                                              |
| [`annotations.update`](https://www.nutrient.io/api/web/NutrientViewer.Instance.html#~AnnotationsUpdateEvent)     | Triggered when existing annotations are updated.                                         |
| [`annotations.delete`](https://www.nutrient.io/api/web/NutrientViewer.Instance.html#~AnnotationsDeleteEvent)     | Triggered when annotations are deleted.                                                  |

### JAVASCRIPT

```js

instance.addEventListener("annotations.load", loadedAnnotations => {
  console.log(loadedAnnotations);
});
instance.addEventListener("annotations.willChange", event => {
  if (event.reason === NutrientViewer.AnnotationsWillChangeReason.DRAW_START) {
    console.log("The user is drawing...");
  }
});
instance.addEventListener("annotations.change", () => {
  console.log("Something in the annotations has changed.");
});
instance.addEventListener("annotations.create", createdAnnotations => {
  console.log(createdAnnotations);
});
instance.addEventListener("annotations.update", updatedAnnotations => {
  console.log(updatedAnnotations);
});
instance.addEventListener("annotations.delete", deletedAnnotations => {
  console.log(deletedAnnotations);
});

```
---

## Related pages

- [Add image annotations to PDFs using JavaScript](/guides/web/annotations/create-edit-and-remove/add-image.md)
- [Annotation flags](/guides/web/annotations/annotation-flags.md)
- [Defining the author of an annotation](/guides/web/annotations/annotation-author-name.md)
- [Cut, copy, paste, and duplicate annotations in PDF using JavaScript](/guides/web/annotations/create-edit-and-remove/cut-copy-duplicate.md)
- [Create PDF annotations using JavaScript](/guides/web/annotations/create-edit-and-remove/create.md)
- [Edit PDF annotations using JavaScript](/guides/web/annotations/create-edit-and-remove/edit.md)
- [Customizing annotation permissions](/guides/web/annotations/create-edit-and-remove/permissions.md)
- [Select PDF annotations using JavaScript](/guides/web/annotations/create-edit-and-remove/multiple-selection.md)
- [Remove PDF annotations using JavaScript](/guides/web/annotations/create-edit-and-remove/remove.md)
- [Rich text in PDF annotations using JavaScript](/guides/web/annotations/create-edit-and-remove/rich-text.md)
- [Undo and redo annotations](/guides/web/annotations/create-edit-and-remove/undo-redo.md)