テキストボックスの値と要素型のJavaScriptをマージする

Question

私は3つのテキストボックスを持っています。これらの名前とIDは異なっています。それらの値を名前またはIDとマージできますが、値をタイプとマージする必要があります。私はどうすればそれをすることができます。

<input type="text" id="txt1" name="textbox1"> 
<input type="text" id="txt2" name="textbox2"> 
<input type="text" id="txt3" name="textbox3"> 

Answer 1

すべてのテキストボックス要素は、タイプによってdocument.querySelectorAll("input[type=text]")を使用して取得できます。 マージする場合は、値を連結することを意味します。

var textBoxes= document.querySelectorAll("input[type=text]"); 
var mergedValue; 

for(var i=0;i<textBoxes.length;i++) 
{ 
    mergedValue+=textBoxes[i].value; 
} 

Answer 2

ここに別の解決策があります。

function mergeData() { 
 
    var textboxes = document.getElementsByTagName("input"); 
 
    var mergedText = ""; 
 
    for (var i = 0; i < textboxes.length; i++) { 
 
    if (textboxes[i].type === "text") { 
 
     mergedText = mergedText + textboxes[i].value; 
 
    } 
 
    } 
 
    document.getElementById("merged").innerHTML = mergedText; 
 
}

<input type="text" id="txt1" name="textbox1"> 
 
<input type="text" id="txt2" name="textbox2"> 
 
<input type="text" id="txt3" name="textbox3"> 
 
<button onclick="mergeData()">Merge</button> 
 

 
<div id="merged"></div>

Answer 3

var dataVal=document.querySelectorAll('[type=text]'); 
 
var myVal=""; 
 
dataVal.forEach(function(entry) { 
 
    myVal+=entry.value; 
 
}); 
 

 
console.log(myVal);

<input type="text" id="txt1" name="textbox1" value="2"> 
 
<input type="text" id="txt2" name="textbox2" value="2"> 
 
<input type="text" id="txt3" name="textbox3" value="2">