Question

我有这个双下拉列表

<div class="container" id = "chooseTables">

  <div class="dropdown">
   <button class="btn btn-default dropdown-toggle" type="button" data-toggle="dropdown">please choose tables <span class="caret"></span></button>

     <ul class="dropdown-menu">

       <li class="dropdown-submenu">
       <a class="test" tabindex="-1" href="#">table for 2<span class="caret"></span></a>
       <ul class="dropdown-menu">
       <li class = "select" id = "table1" ><a tabindex="-1" href="#"><align = "middle">-----table1-----</a></li>
       <li class = "select" id = "table2" ><a tabindex="-1" href="#"><align = "middle">-----table2-----</a></li>
       <li class = "select" id = "table3" ><a tabindex="-1" href="#"><align = "middle">-----table3-----</a></li>
      </ul>
      </li>
    </ul>
   </div>
</div>

每次服务器向我发送一些信息时，我都希望更新这些<li>代码中的文字内容。

即。

var room = document.getElementsByClassName("select")

    room[1].textContent = "vacant"

但我无法仅更改文字而不会影响align和href

等属性

我尝试了textContent和childNodes[0].nodeValue他们没有真正发挥作用。

这是小提琴：http://jsfiddle.net/TU4FB/135/

Answer 1

room[1].getElementsByTagName('a')[0].textContent = "11"
or
room[1].getElementsByTagName('a')[0].getElementsByTagName('align')[0].textContent = "11"

更改文本而不影响其他属性

1 个答案: