How can I get the element name attribute in JavaScript?

HTML :

<input class="so" name="Name" value="bob"></input>
<input class="so" name="LastName" value="Feyzi"></input>
<input class="so" name="Email"></input>
<input class="so" name="Address"></input>
<input type="submit"></input>

JavaScript :

var person={};
var cars = document.querySelectorAll(".so");
for (i = 0; i < cars.length; i++) { 
  var elname = document.getElementByClassName('.so')[i].getAttribute('name');
  //var eln = document.getElementsByTagName("input")[i].getAttribute("name");
  var vala = document.querySelectorAll('.so')[i].value;
  //alert(vala);
  alert(elname);
}

After I run the script I want the person object to be set with this data:

person {
    Name: "bob",
    LastName: "Feyzi",
    Email: "",
    Adderss: ""
}  

JSFiddle

How can I get the element name attribute in JavaScript?

HTML :

<input class="so" name="Name" value="bob"></input>
<input class="so" name="LastName" value="Feyzi"></input>
<input class="so" name="Email"></input>
<input class="so" name="Address"></input>
<input type="submit"></input>

JavaScript :

var person={};
var cars = document.querySelectorAll(".so");
for (i = 0; i < cars.length; i++) { 
  var elname = document.getElementByClassName('.so')[i].getAttribute('name');
  //var eln = document.getElementsByTagName("input")[i].getAttribute("name");
  var vala = document.querySelectorAll('.so')[i].value;
  //alert(vala);
  alert(elname);
}

After I run the script I want the person object to be set with this data:

person {
    Name: "bob",
    LastName: "Feyzi",
    Email: "",
    Adderss: ""
}  

JSFiddle

• javascript
• arrays

Share Improve this question Follow edited Jan 9, 2015 at 18:08 potashin 44.6k1111 gold badges9191 silver badges112112 bronze badges asked Jan 9, 2015 at 17:50 Arman FeyziArman Feyzi 83822 gold badges1313 silver badges2828 bronze badges 3

• Plural. getElementsByClassName not getElementByClassName. – j08691 Commented Jan 9, 2015 at 17:54
• Why use document.getElementsByTagName("input") while you could use cars as reference in your for lus? E.g. cars[i].value – Mouser Commented Jan 9, 2015 at 17:55
• Also, you are not supposed to have .so, rather so. You have already specified that you are looking for a class. – msfoster Commented Jan 9, 2015 at 17:59

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 6

Use the collection that you've already found with querySelectorAll to get the values of the value and name attributes :

var person = {}
var cars = document.querySelectorAll(".so")
for (i = 0; i < cars.length; i++) { 
  person[cars[i].name] = cars[i].value
}
console.log(person)

JSFiddle

Because getElementByClassName does not exist (also it would have no use in your script). Use this:

 var person={};
 var cars = document.querySelectorAll(".so");
 for (i = 0; i < cars.length; i++) { 
       alert(cars[i].name)
 }

Firstly, use cars variable instead of calling querySelectorAll every time. Secondly, use addEventListener to execute code on click.

Fiddle: http://jsfiddle/guyavunf/3/

Code:

// HTML
<input class="so" name="Name" value="bob"></input>
<input class="so" name="LastName" value="Feyzi"></input>
<input class="so" name="Email"></input>
<input class="so" name="Address"></input>
<input class="submit" type="submit"></input>

// JS
document.querySelector('.submit').addEventListener('click', function() {
    var person={};
    var cars = document.querySelectorAll(".so");
    for (i = 0; i < cars.length; i++) { 
        var name = cars[i].name;
        var value = cars[i].value;
        alert(name + ': ' + value);
    }
});