How to create a simple browser extension?

Question

JavaScript

How to create a simple Google-Chrome browser extension? The application must use JQuery.Ajax to send data to the server for storage. The data for this case will be information about the attributes of the HTML elements of the block:

<div class="info fl_l">
    <div class="title_wrap clear_fix">
      <div id="ac_name" class="ac_name fl_l">
        <span id="ac_performer" class="performer">Linkin Park</span> –
        <span id="ac_title" class="title">In The End(Cover)[RUS]</span>
      </div>
      <span id="ac_duration" class="duration fl_r">-2:07</span>
    </div>
    ......
     <div id="ac_load_line" class="ac_load_line" style="width: 100%;"><!-- --></div>
      <div id="ac_pr_line" class="ac_progress_line" style="width: 27.336615195057817%;">
       <div id="ac_pr_slider" class="ac_slider"><!-- --></div>
      </div>
     .....
  </div>

* For those who could guess, this is information about the music composition being played from vk.com

. Is it possible to select elements from the page from under Google Chrome Apps? Can jQuery be used for this? Transferred data: {"Artist":"Linken Park", "Song":"In The End(Cover)", "Time":"2:07","Progress":"27.336615195057817%"}. Is it possible to? How?

Answer 1

Lesson on creating a Chrome plugin
_

Answer 2

In my opinion, the correct option is an extension. You can definitely use jQuery there. And the application (native) is the application, that is, it performs some kind of finished functionality, and does not complement it. I didn’t come across the application architecture for Chrome, but there is still the same HTML and JS, which means you can use jQuery. The application has features for working with USB and other things, while the extension, in fact, with the content of the page.