1

Is it possible to get HTML with tags from the lwc components?

Can I get something like (in my JS)

<table>
  <tr>
    <th>SomeHeading</th>
  </tr>
  <tr>
    <td>SomeVal1</td>
  </tr>
  <tr>
    <td>SomeVal2</td>
  </tr>
</table>

from <lightning-datatable ....>

I tried

  1. this.template.querySelector('lightning-datatable'); but it returns [object HTMLElement]

  2. if I try to add .toString() to it then it returns SecureElement: [object HTMLElement]{ key: {"namespace":"c"} }

  3. Adding .data with JSON.stringify returns the JSON which was passed to the lightning-datatable

  4. while adding .value gives undefined

In none of the above case I could retrieve the actual HTML. So how can can I get the HTML content preferably in a string format from any lighting component, especially in my case from lightning-datatable?

1 Answer 1

0

In short, you can't get the full html contents in because of Shadow DOM in LWC. To understand more about shadow dom, read here

2
  • Thanks for the answer. So, Can you please let me know what exactly is returned by this.template.querySelector(), also what all methods are available for LWC in querySelector for LWC? Also, to drill down, what is the command to make [object HTMLElement] in human readable format?
    – user43598
    Apr 12, 2021 at 5:41
  • 1
    Aura does not use Shadow DOM. Only LWC does.
    – Phil W
    Apr 12, 2021 at 6:32

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .