如何获得< span>值?

时间:2012-08-21 09:26:32

标签: javascript

有一段代码,但无法使用<id>代码。

那么,我该如何进入<span> 1 2 3 4

<div id="test">
    <span>1</span>
    <span>2</span>
    <span>3</span>
    <span>4</span>
<div>

7 个答案:

答案 0 :(得分:26)

试试这个

var div = document.getElementById("test");
var spans = div.getElementsByTagName("span");

for(i=0;i<spans.length;i++)
{
  alert(spans[i].innerHTML);
}

答案 1 :(得分:7)

var test = document.getElementById( 'test' );

// To get the text only, you can use "textContent"
console.log( test.textContent ); // "1 2 3 4"

textContent是标准方式。 innerText是用于旧版IE的属性。如果您希望尽可能使用跨浏览器,请递归使用nodeValue

答案 2 :(得分:3)

没有jQuery标签,所以我假设是纯粹的JavaScript

var spanText = document.getElementById('targetSpanId').innerText;

你需要的是什么

但在你的情况下:

var spans = document.getElementById('test').getElementsByTagName('span');//returns node-list of spans
for (var i=0;i<spans.length;i++)
{
    console.log(spans[i].innerText);//logs 1 for i === 0, 2 for i === 1 etc
}

Here's a fiddle

答案 3 :(得分:1)

纯粹的javascript就像这样

var children = document.getElementById('test').children;

如果您使用的是jQuery,那就像这样

$("#test").children()

答案 4 :(得分:1)

<div id="test">
    <span>1</span>
    <span>2</span>
    <span>3</span>
    <span>4</span>
</div>
<div id="test2"></div>

<script type="text/javascript">
    var getDiv = document.getElementById('test');
    var getSpan = getDiv.getElementsByTagName('span');​​​
    var divDump = document.getElementById('test2');

    for (var i=0; i<getSpan.length; i++) {
        divDump.innerHTML = divDump.innerHTML + ' ' + getSpan[i].innerHTML;
    }
</script>

答案 5 :(得分:0)

您可以使用querySelectorAll获取所有span元素,然后使用新的ES2015(ES6)扩展运算符转换StaticSeodeAllList返回到span数组,然后使用map运算符获取项目列表。

参见下面的示例

&#13;
&#13;
([...document.querySelectorAll('#test span')]).map(x => console.log(x.innerHTML))
&#13;
<div id="test">
    <span>1</span>
    <span>2</span>
    <span>3</span>
    <span>4</span>
<div>
&#13;
&#13;
&#13;

答案 6 :(得分:0)

您需要更改以下代码: -

<html>
<body>

<span id="span_Id">Click the button to display the content.</span>

<button onclick="displayDate()">Click Me</button>

<script>
function displayDate() {
   var span_Text = document.getElementById("span_Id").innerText;
   alert (span_Text);
}
</script>
</body>
</html>

执行此操作后,您将获得警告标记值。