2017-12-06 11 views
-3

<div>のテキストまたはDOMプロパティの値を取得したい場合、値は保卫科, ですが、私はいつもundefinedまたはJSエラーを受け取ります。このdivテキストまたはこのDOMの値を取得するにはどうすればよいですか?

私はJSを初めて利用しています。私はdivのテキストを取得するいくつかの方法を試していますが、私は失敗しました。私は助けが必要です。

このHTMLスニペットはorgチャートであり、これを反復して結果の値をjsonオブジェクトに連結して構造を取得しますが、私はJS DOM操作に慣れていません。

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>

+2

あなたはあなたのコードを示していただけますか? – edkeveked

+2

あなたの努力のいくつかを示してください、私たちはそこからあなたを助けます – Dean

+0

[良い質問をどうやって得るのですか?](https://stackoverflow.com/help/how-to-ask) –

答えて

0

私はそれが動作することを試してみました:

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 
} 
+0

ありがとうございます –

+0

問題はありません! :) 私の答えを記してもらえますか? – MMHarbaz

+0

私の評判は十分ではありません、ごめんなさい –

関連する問題