Home > Backend Development > PHP Tutorial > javascript - How to detect the event that the content of an element has been modified?

javascript - How to detect the event that the content of an element has been modified?

WBOY
Release: 2016-07-06 13:53:17
Original
1169 people have browsed it

For example, I have a p element with some text inside, and then I have a button. Click the button to replace the content in the p element. Then what kind of events can be bound to the p element to let me know that it has been modified? Is there any way to achieve this?

Reply content:

For example, I have a p element with some text inside, and then I have a button. Click the button to replace the content in the p element. Then what kind of events can be bound to the p element to let me know that it has been modified? Is there any way to achieve this?

http://stackoverflow.com/questions/9470931/is-there-any-on-dom-change-event

The latest MutationObserver should be able to meet the needs. For details, see https://developer.mozilla.org/zh-CN/docs/Web/API/MutationObserver

MutationObserver provides developers with the ability to respond appropriately when the DOM tree changes within a certain range.

Coveres child node changes and attribute changes.

It is more intuitive if you use event listeners, such as DOMNodeInserted, DOMNodeRemoved, etc. But MutationObserver is designed to replace Mutation events -- DOMNodeInserted, etc.

This design is a bit like Promise, without the shadow of event listeners.

Thanks for the invitation. Click on the event to send a ajax request to send your modified operations to others.

The

p element itself does not have a change event, so you have to do logical processing when clicking the button. Anyway, clicking this button will definitely modify the content of the p element. The worst thing is that if p is modified in multiple places, this Sometimes you have to write the same logic processing repeatedly, but if you use a framework, such watchers are provided in angular and vue

DOMSubtreeModified
This event is used by very few people. . . .

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template