在javascript中获取元素子元素的值

Question

我试图获取元素子元素的值。这是元素：

<li id="1" style="display:normal">
    <h2 id="label_lg">Temp Set (º<span class="degsign">C</span>)</h2>
    <p id="ihi" style="color:teal;font-size:3vw;">--</p>
</li>

如果可能，我希望获得<p></p>的值。我试过用

document.getElementById(1).childNodes[1].nodeValue;

和

var o = document.getElementById(i).children
o[1].nodeValue

没有任何效果，警报始终返回null。

Answer 1

因为你已经指定了jQuery：

$('#1 p').text();

就这么简单。

Answer 2

尝试：

var pString = document.getElementById("ihi").value;

并更改值：

pString.innerHTML = "Your string"

Answer 3

使用JS

alert(document.getElementById('ihi').innerHTML)

<li id="1" style="display:normal">
      <h2 id="label_lg">Temp Set (º<span class="degsign">C</span>)</h2>
      <p id="ihi" style="color:teal;font-size:3vw;">--</p>
 </li>

使用JQUERY：

alert($('#ihi').html());

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<li id="1" style="display:normal">
      <h2 id="label_lg">Temp Set (º<span class="degsign">C</span>)</h2>
      <p id="ihi" style="color:teal;font-size:3vw;">--</p>
 </li>

Answer 4

您可以使用以下内容：

innerText ||的textContent

这些将为您提供元素文本。如果您在small中嵌套了p标记等元素，则会获得所有文本。

的innerHTML

这将返回元素的HTML。如果您有嵌套元素，它将不返回文本，而是返回该元素的原始html。但是如果元素没有子元素，那么输出将是相同的。

(function() {
  var parent = document.getElementById('1');
  var _innerText = parent.innerText;
  var _innerHTML = parent.innerHTML;
  var _textContent = parent.textContent;

  console.log(_innerText, _innerHTML, _textContent)
})()

<li id="1" style="display:normal">
  <h2 id="label_lg">Temp Set (º<span class="degsign">C</span>)</h2>
  <p id="ihi" style="color:teal;font-size:3vw;">--</p>
</li>

Answer 5

您可以使用innerText属性：

alert(document.getElementById(1).childNodes[1].innerText);
// Alerts "--"

如果您想使用jQuery ：

alert($("1").child("#ihi").html())