How to interact between script content and panel

Question

How is the connection between the panel and the content of the script? How can we dynamically update the contents of a panel from the contents of a script? The content of the script accesses the DOM of the loaded page. Now every time there is a DOM change on the web page that should be displayed in the panel. How can we do this? Can someone explain with an example?

UPDATE: here is MY ADDON CODE

Read this code. I do not get output

Answer 1

Your question is about the relationship between two content scripts - one script content uploaded to a web page and other script content uploaded to the panel. These content scripts cannot be directly linked, they must exchange data through the extension ( main.js or some module created by them). In other words: a webpage changes, the content of the script recognizes this change and sends a message to the extension. The extension accepts the message and sends it to the content script in the panel. The contents of the script in the panel then updates the contents of the panel as necessary.