How to get this div text or this DOM's value?

Question

I want to get text in <div> or value of DOM property, the value is 保卫科, but I alway get undefined or JS error.

I am new to JS. I am trying some ways to get the text of a div, but I have failed. I need help.

This HTML snippet is an org chart, and I now iterate through it to get the structure it represents and concatenate the resulting values into a json object, but I am unfamiliar with the JS DOM operation, which bothers me all day

function loop($chart) {
        // var that = this;
        //$chart是一个DOM
        var $tr = $chart.find('tr:first');
        //找到根结点 获取id id为1 拼接json
        // console.log($tr);
        console.log($tr.find('.node:first').innerText);
        var subObj = { 'id': $tr.find('.node')[0].id ,'name':$tr.find('.node')[0].value};
        //找到tr中的最后一个 记录子节点的tr 然后遍历
        $tr.siblings(':last').children().each(
          function () {
            //如果subObj没有子节点 则创建一个数组装子节点
            if (!subObj.subordinate) {
               subObj.subordinate = [];
              }
              //往数组中push东西
            subObj.subordinate.push(loop($(this)));
          });
        return subObj;
      }

<div id="orgchart" class="orgchart view-state">
  <table>
    <tr>
      <td colspan="4">
        <div id="1512554614742741" value="保卫处" class="node">
          <div class="title">
            <i class="fa fa-th-large symbol"></i>保卫处</div>
          <i class="edge verticalEdge bottomEdge fa"></i>
        </div>
      </td>
    </tr>
    <tr class="lines">
      <td colspan="4">
        <div class="downLine"></div>
      </td>
    </tr>
    <tr class="lines">
      <td class="rightLine">&nbsp;</td>
      <td class="leftLine topLine">&nbsp;</td>
      <td class="rightLine topLine">&nbsp;</td>
      <td class="leftLine">&nbsp;</td>
    </tr>
    <tr class="nodes">
      <td colspan="2">
        <table>
          <tr>
            <td colspan="2">
              <div id="1512554614755264" data-parent="1" value="2部门" class="node">
                <div class="title">
                  <i class="fa fa-th-large symbol"></i>2部门</div>
                <i class="edge verticalEdge topEdge fa"></i>
                <i class="edge horizontalEdge rightEdge fa"></i>
                <i class="edge horizontalEdge leftEdge fa"></i>
                <i class="edge verticalEdge bottomEdge fa"></i>
              </div>
            </td>
          </tr>
          <tr class="lines">
            <td colspan="2">
              <div class="downLine"></div>
            </td>
          </tr>
          <tr class="lines">
            <td class="rightLine">&nbsp;</td>
            <td class="leftLine">&nbsp;</td>
          </tr>
          <tr class="nodes">
            <td colspan="2">
              <table>
                <tr>
                  <td>
                    <div id="1512554614762739" data-parent="2" value="6部门" class="node">
                      <div class="title">6部门</div>
                      <i class="edge verticalEdge topEdge fa"></i>
                    </div>
                  </td>
                </tr>
              </table>
            </td>
          </tr>
        </table>
      </td>
      <td colspan="2">
        <table>
          <tr>
            <td>
              <div id="1512554614773842" data-parent="1" value="4部门" class="node">
                <div class="title">4部门</div>
                <i class="edge verticalEdge topEdge fa"></i>
                <i class="edge horizontalEdge rightEdge fa"></i>
                <i class="edge horizontalEdge leftEdge fa"></i>
              </div>
            </td>
          </tr>
        </table>
      </td>
    </tr>
  </table>
</div>

Answer 1

i tried it it works :

function myFunction() {
   var x = document.getElementById("1512554614742741").getAttributeNode("value").value;
    //here you have 保卫科  in x variable but it doesn't show anywhere on the page
    //you choose what you want to do  with it for example show it in the html page
}