document.getElementById


#1

Only gave me steve output:


#2

Hey there, @arcsurfer28970,
Upon checking your code, it's clear for me, why it only shows steve.

  • First, try listing all your friends AFTER the search() function.
  • Second, close every friends-Object, such as every function with a semicolon ; after the closing curly bracket }
  • Third, assign your functions to variables.
  • Fourth, why do you put it all in a HTML, since you only got a JS-file?

Take this as a reference:

var friends = {};
friends.bill = {
  firstName: "Bill",
  lastName: "Gates",
  number: "(206) 555-5555",
  address: ['Microsoft Way']
};
friends.steve = {
  firstName: "Steve",
  lastName: "Jobs",
  number: "(444) 111 000",
  address: ['Apple way']
};

var list = function(obj) {
  for(var prop in obj) {
    console.log(prop);
  }
};

var search = function(name) {
  for(var key in friends) {
    if(friends[key].firstName === name) {
      console.log(friends[key]);
      return friends[key];
    }
  }
};

list(friends);
search("Steve");

Hope this will help you understanding :slight_smile:
If you got any further problems, feel free to get in touch with me :smiley:


#3

Thanks 0xb4dc0ded;
but if I need to see my out put in the page not in console.log i want use document.getElementById how can i do that?


#4

Can you copy paste your code to the forum so i can actually run it? Following my suggestions seemed to have worked (a bit)


#5

<body>
  <p id="demo"></p>
 
  <script>
    var friends = {};
    friends.bill = {
      firstName: "Bill",
      lastName: "Gates",
      number: "(206) 555-5555",
      address: ['Microsoft Way']
      };
    friends.steve = {
      firstName: "Steve",
      lastName: "Jobes",
      number: "(444) 111 000",
      address: ["Apple way"]
    };
    var list = function(obj) {
      for( var key in obj){
        console.log(obj);
      document.getElementById("demo").innerHTML = key + "<br>";
      }
    }

    var search = function(name) {
      for(var key in friends){
        if(name === friends[key].firstName){
          console.log(friends[key]);
        }
      }
    }
    list(friends);
    // search("Steve");
  </script>
</body>

#6

i put your code here, jsbin will give you both a console, and a webpage (so you can see the output besides each other, really nice)

Like i already suspected, your .innerHTML overwrites each time something is added to the element, as you can read here


#7

but still gave the answer steve only whern i'm using document.get....


#8

yea, because innerHTML overwrites what you store in the paragraph in each run of the loop. You must append them to the paragraph, currently you overwriting rather then appending. This is more easily don with jquery, but can be done with js as well


#9

Can you gave me other way to do that in the page?


#10

You can use the solution posted in the stackoverflow question i linked to. Just append a new element to your paragraph, and add the result to this new element


#11

Thanks stetim94:
i do what you told me to do it, i but my queasiness in stackoverflow site and i received my answer
thank you :slight_smile: