{"id":19451382,"url":"https://github.com/yazaabed/dommutationobserver","last_synced_at":"2025-06-24T18:42:12.193Z","repository":{"id":117358238,"uuid":"111481451","full_name":"yazaabed/DomMutationObserver","owner":"yazaabed","description":"Simple wrapper for MutationObserver","archived":false,"fork":false,"pushed_at":"2018-03-10T01:56:14.000Z","size":20,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"master","last_synced_at":"2025-02-12T03:17:08.450Z","etag":null,"topics":["dom-changes","listen","mutationobserver","subtree","trigger","wrapper"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/yazaabed.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2017-11-21T01:13:14.000Z","updated_at":"2023-12-10T01:05:34.000Z","dependencies_parsed_at":"2023-07-08T06:00:16.214Z","dependency_job_id":null,"html_url":"https://github.com/yazaabed/DomMutationObserver","commit_stats":null,"previous_names":["yazanaabeed/dommutationobserver"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/yazaabed%2FDomMutationObserver","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/yazaabed%2FDomMutationObserver/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/yazaabed%2FDomMutationObserver/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/yazaabed%2FDomMutationObserver/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/yazaabed","download_url":"https://codeload.github.com/yazaabed/DomMutationObserver/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":240638961,"owners_count":19833389,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["dom-changes","listen","mutationobserver","subtree","trigger","wrapper"],"created_at":"2024-11-10T16:41:28.267Z","updated_at":"2025-02-25T09:25:42.877Z","avatar_url":"https://github.com/yazaabed.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# DomMutationObserver\nSimple wrapper for MutationObserver. MutationObserver needs to handle DOM changes and listen to DOM changes without killing browser performance if this not supported we fall back to simple setInterval action\n\n\n### Supported MutationObserver attributes and every event for these attributes:\n* **childList**: Set this to true if the element list changed and triggered with appended element.\n* **subtree**: Set this to true to listen to every children inside this element.\n* **attributes**: Set this to true if you need to listen to attributes changes.\n* **attributeOldValue**: Get and store value for changed attributes\n* **characterDataOldValue**: Get and store value for changed char data\n\n\n### How to use\nYou can include it on your project and every time you need to define a new instance from it.\nYou can pass your own options and events on init function\n\n```js\nvar domEventChangesListener = new YDomMutationObserver();\n\nvar domEventOptions = {\n      attributes: false,\n      characterData: true,\n      childList: true,\n      subtree: true,\n      attributeOldValue: false,\n      characterDataOldValue: false\n};\n\ndomEventChangesListener.init(element[0] || jQuery, domEventOptions);\ndomEventChangesListener.on(YDomMutationObserver.EVENTS.ON_CHARACTER_DATA_CHANGED, domChanged);\ndomEventChangesListener.on(YDomMutationObserver.EVENTS.ON_CHILD_LIST_CHANGED, domChanged);\ndomEventChangesListener.on(YDomMutationObserver.EVENTS.ON_CHANGE, harriCallbacks.domChanged)\n```\n\nAfter that you start listen or observe the changes on your dom.\n```js\ndomEventChangesListener.startListening(500);\n```\n\nTo trigger any function manually use the trigger as async call or syncTrigger as sync call function\nNo need to send the record every time if you don't have it you can leave it.\n\n```js\nself.trigger('on-attributes-changed', record);\n```\n\nOr\n\n```js\nself.syncTrigger('on-attributes-changed', record);\n\n```\n\n### Events\nYou can use the 'on' function that pass the event name with callback to trigger when DOM changed or you triggered by you self.\n\n* **on-attributes-changed** Trigger after the attributes changed with the whole changed object.\n* **on-character-data-changed** Trigger when char data for this dom changed.\n* **on-child-list-changed** Trigger when any child list for this dom changed.\n* **on-subtree-changed** Trigger when children on this dom modified or changed.\n* **on-change** Trigger for non-support browsers you need to pass it every time to handle default behavior.\n\n\n### For not supported browsers\nTrigger the on-change event that triggered by default when the browser not support this\n\n\n### Compatibility\nI have tested this on work for [HARRI](https://harri.com/) project for auto complete fields that shows a pop list with names to tag them.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fyazaabed%2Fdommutationobserver","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fyazaabed%2Fdommutationobserver","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fyazaabed%2Fdommutationobserver/lists"}