I'm trying to achieve something very simple and I'm blocked by the not so clear explanations in the chrome extension development official website.

I am trying to build a chrome extension with one button that extract the H2 from the specific page it's on, and pass this data into the extension to be shown there in a list (or something else if more easily implemented).

So from what I read I struggle with the logics of all the files and permissions:

1. So using the message passing I was able to send this data in a way but it's only working when I reload the page when the extension is opened(clicked on), the moment I close the extension it doesn't work anymore.
2. I saw that there is a way to use scripts injection with chrome.scripting, have no idea how it works though because when I tried the official documentation example it doesn't have the mechanism of listening to when I click the button in the extension, it just fires away.
3. There is the local storage, tried it but I had hard time accessing the data it collects with clicking the button inside the extension. if it's possible at all.
4. I saw couple of guys on youtube talking about passing a message through the background.js, which I can get the data from the content.js but how do I pass it to the extension when I click the button inside of it?
5. I saw one guy on youtube using var to share the info through the "window." but I know that this might have other problems because the use of a var.

The real question is: Is there a difference between all those ways? are there any limitations? cons/pros? are there other ways?

Where can I really learn about chrome extension development?

Thanks in advance.