獲取節點的文本

Question

在ASP.NET應用程序中，我有一個IreeView。

這是視圖中的節點之一：

<td style="white-space: nowrap;">
<input id="TreeView1n10CheckBox" type="checkbox" checked="checked" name="TreeView1n10CheckBox">
<a id="TreeView1t10" onclick="TreeView_SelectNode(TreeView1_Data, this,'TreeView1t10');" href="javascript:__doPostBack('TreeView1','sPreAnalytical\\Test Requisitions\\2 Specimens: 1 Req')" class="TreeView1_0">2 Specimens: 1 Req</a>

如您所見，這是一個復選框，並且在'TreeView1','sPreAnalytical\\\\Test Requisitions\\\\2 Specimens: 1 Req'之后有文本'TreeView1','sPreAnalytical\\\\Test Requisitions\\\\2 Specimens: 1 Req'

如何在客戶端獲取文本2 Specimens: 1 Req' ，以及如何使用JavaScript修改文本並將修改后的TreeView顯示給客戶端？

這很漂亮：

function check_OnTreeNodeChecked(event) {
                  var TreeNode = event.srcElement || event.target;
                  if (TreeNode.tagName == "INPUT" && TreeNode.type == "checkbox") {
                      if (TreeNode.checked) {
                          var elNode = document.getElementById("TreeView1t10");
                          var sText = elNode.innerText || elNode.innerHTML;

                          alert(sText);
                          elNode.innerHTML = "Whatever you want";
                      }
                  }

              } 

但是，由於我需要修改復選框旁邊的特定文本，因此我需要能夠知道它是哪個元素ID，而不是隱式指定var elNode = document.getElementById("TreeView1t10");

問題我如何獲取已檢查盒子的元素ID？

Answer 1

可以使用以下方式檢索文本：

var elNode = document.getElementById("TreeView1t10");
var sText = elNode.innerText || elNode.innerHTML;

使用以下方法進行修改：

elNode.innerHTML = "Whatever you want";

要在點擊處理程序中獲取樹節點的ID，請執行以下操作：

從我的頭頂開始，未經測試，類似這樣的事情將使您從復選框ID獲得樹節點：

復選框ID =“ TreeView1n10CheckBox”; 用任何內容替換“ CheckBox”，所以我們有“ TreeView1n10”。 然后用“ t”替換“ n”，我們得到“ TreeView1t10”，它是相應錨標記的ID。

var sTreeID = TreeNode.id.replace("CheckBox", "").replace("n", "t");
var elTreeNode = document.getElementById(sTreeID);

Answer 2

使用jQuery，這非常簡單...

var oldText = $('.TreeView1_0').text();
$('.TreeView1_0').text('new text here');

編輯：

此處的示例： http : //jsfiddle.net/shaneblake/ZG888/

Answer 3

對於樹形視圖，該類可能被多次利用，因此訪問特定元素會更有用處。

var oldText = $('#TreeView1t10').html();

如果您需要更新所有樹文本，則也可以非常簡單地遍歷它們。

$('.TreeView1t10').each(function() {
    var oldText = $(this).find('a').html();
});