skip to Main Content

I read code on element using

const elem = document.getElementById("TcHmiRecipeEdit")
console.log(elem);

results:
enter image description here
What code in Javascript I need to use to get values Marked in the photo. I’m starting my adventure with javascript and what we have a huge problem with is actually extracting values from the code as in the example above.

2

Answers


  1. querySelector and querySeletorAll are suitable for this purpose.

    querySelector, querySelectorAll

    document.querySelectorAll('#TcHmiRecipeEdit table th').forEach(el => {
        console.log(el.textContent);
    });
    
    Login or Signup to reply.
  2. Spreading a querySelectorAll and mapping the textContent

    const thVals = [...document.querySelectorAll('#TchmiRecipeEdit table th')]
      .map(th => th.textContent.trim());
    
    console.log(thVals)
    <div id="TchmiRecipeEdit" style="inset: 16px;">
      <div class=" TCHES Controls Beckhoff TcHiRecipeEdit template tched-box " tabindex="-1 ">
        <div class="Tched Controls Beckhoff TcHnRecipeEdit-editing pane ">
          <div class="TcHed_Controls Beckhoff TcHndRecipeEdit-editing-box">
            <div class="Tchad Controls Beckhoff TcHniRecipeEdit-editing-area">
              <table>
                <thead>
                  <tr>
                    <th>Name</th>
                    <th>Value</th>
                    <th>in</th>
                    <th>Unit</th>
                  </tr>
                </thead>
              </table>
            </div>
          </div>
        </div>
      </div>
    </div>
    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search