Is there a video tutorial for this module?

I haven't had time to produce any videos.

If you are attaching our htmx/drupal asset library, then the only thing I can see in your code is to revisit the documentation for hx-select. I suspect that value needs to be article since node markup is typically wrapped in that tag. I think you are seeing no response because there is no content with id="drupal-off-canvas-wrapper" in the response.

I know now, it is the wrong by hx-select, it uses the selector from the page of hx-get.

Also, can it obtain data from different domains?

 {{ attach_library('htmx/drupal') }}
 
  <button hx-get="https://abc.website.com/node/1"
        hx-target="#drupal-off-canvas-wrapper"
        hx-select="#page-wrapper"
        hx-swap="outerHTML ignoreTitle:true" class="button">
     Add
  </button>
  
  <div id="drupal-off-canvas-wrapper" >11</div>

I tested it doesn't work.

You should be able to do that unless there is something going on. See htmx.config.selfRequestsOnly in https://htmx.org/reference/#config

See our documentation on Drupal asset libraries, also attach the debug library and add the given attribute to you markup or an ancestor. You will get console logging for all HTMX activity on that tag or its descendants.

I now understand how to extract data from a page into current page, but there are still many questions that I don't understand, such as creating a block view or a non page view without a separate URL. How can I use HTMX to load the result set of the view onto a page?Can it do? not from URL page.

 {{ attach_library('htmx/drupal') }}
 
  //<button hx-get="/htmx/node/1/teaser"
  <button hx-get="/htmx/views/content_recent/block_1"  // I know it's wrong, I'm just using it to illustrate the issue.
        hx-target="#drupal-off-canvas-wrapper"
        hx-select="#page-wrapper"
        hx-swap="outerHTML ignoreTitle:true" class="button">
     Add
  </button>
  
  <div id="drupal-off-canvas-wrapper" >11</div>

We haven't done anything targeted at views, but a block display is probably your best bet. See if this meets your need:

2. Build the block display
3. Browse to /admin/structure/htmx-block and create an HTMX block that displays your view block display, which essentially is a Drupal block without a region.
4. Display your block in one of 2 ways, see Displaying HTMX Blocks

References:
route htmx_blocks.view