使用javascript获取标签的值

我想在点击标签后获取标签的值。我只使用JavaScript和没有jQuery。这里是我的html：使用javascript获取标签的值

<div class="touche 1"> 
    <h1>1</h1> 
</div> 
<div class="touche 2"> 
    <h1>2</h1> 
</div> 
<div class="touche 3"> 
    <h1>3</h1> 
</div>

我所需要的值1,2,3，等...到一个变量。 div的工作就像一个计算器按钮！

谢谢！

来源

2014-10-10 ahbon

而你究竟在何处遇到问题，当你试图解决这个自己？ – 2014-10-10 18:18:20

http://stackoverflow.com/questions/19451144/how-do-i-get-html-tag-value-div-in-javascript – 2014-10-10 18:18:32

我只是试过函数$ id（id）{return document.getElementById（id） ;} – ahbon 2014-10-10 18:22:52

下面是代码

function getval(thisa) 
 
{ 
 
    alert(thisa.innerHTML); 
 
}

<div class="touche 1"> 
 
    <h1 onclick="getval(this)">1</h1> 
 
</div> 
 
<div class="touche 2"> 
 
    <h1 onclick="getval(this)">2</h1> 
 
</div> 
 
<div class="touche 3"> 
 
    <h1 onclick="getval(this)">3</h1> 
 
</div>

来源

2014-10-10 18:31:56 Aqib1604

不错！但它返回 ... – ahbon 2014-10-10 18:41:27

好的！我用thisa.childNodes [0] .innerHTML，它的工作原理！非常感谢 – ahbon 2014-10-10 18:49:44

如果要直接访问<h1>标记，可以使用getElementsByTagName()，它返回一个HTMLElements集合。你可以遍历一个附加的点击事件处理程序。

var elms = document.getElementsByTagName("h1"); 
 
    for(var i=0;i<elms.length;i++){ 
 
     elms[i].addEventListener("click",function(){ 
 
     console.log(this.textContent); 
 
    }); 
 
}

<div class="touche 1"> 
 
    <h1>1</h1> 
 
</div> 
 
<div class="touche 2"> 
 
    <h1>2</h1> 
 
</div> 
 
<div class="touche 3"> 
 
    <h1>3</h1> 
 
</div>

如果你要绑定：

里面的事件处理程序，您可以按如下方式使用它textContent属性获取文本（解读为价值） <div>的收听者，您可以使用getElementsByTagName()或getElementsByClassName()访问元素，通过它们循环一个nd附加点击事件监听器。

在事件处理程序中，您可以使用children属性访问<h1>获取它的值，如上所述。

var elms = document.getElementsByClassName("touche"); 
 
for(var i=0;i<elms.length;i++){ 
 
    elms[i].addEventListener("click",function(){ 
 
    console.log(this.children[0].textContent); 
 
    }); 
 
}

<div class="touche 1"> 
 
    <h1>1</h1> 
 
</div> 
 
<div class="touche 2"> 
 
    <h1>2</h1> 
 
</div> 
 
<div class="touche 3"> 
 
    <h1>3</h1> 
 
</div>

来源

2014-10-10 18:28:51

使用以下JS来做到这一点。 JSFIDDLE

var controls = document.getElementsByClassName("touche"); 
for(var i = 0;i<controls.length;i++) 
{ 
    controls[i].onclick = function() { 
     console.log(this.childNodes[1].innerText); 

     alert(this.childNodes[1].innerText); 
    }; 
}

来源

2014-10-10 18:29:41

使用javascript获取标签的值

回答

相关问题