SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Guru
    Join Date
    Jun 2009
    Posts
    825
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)

    jquery -> plain JS

    I use jQuery all time now, never plain JS anymore.. but now I need to do something in plain JS.... how would I do something like this in plain JS?


    Code:
    	$('h5').each(function(i) {
    		$(this).html(ppl.person[i].name);
    	});
    	$('p').each(function(i) {
    		$(this).html('By: ' + ppl.person[i].age);	
    	});
    thank you...

  2. #2
    Non-Member
    Join Date
    Apr 2004
    Location
    Miami, FL, USA
    Posts
    448
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Something like this should work:

    Code:
    var elems = document.getElementsByTagName("h5");
    for (var i in elems) {
        elems[i].innerHtml = ppl.person[i].age;
    }
    var elems = document.getElementsByTagName("p");
    for (var i in elems) {
        elems[i].innerHtml = "By: " + ppl.person[i].age;
    }

  3. #3
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,861
    Mentioned
    25 Post(s)
    Tagged
    1 Thread(s)
    They are nodelists not objects so you should NOT be using for.in as it will process the length along with the nodes.

    Code:
    var elems = document.getElementsByTagName("h5");
    for (var i=elems.length-1; i >=0; i--) {
        elems[i].innerHtml = ppl.person[i].age;
    }
    elems = document.getElementsByTagName("p");
    for (i=elems.length-1; i >=0; i--) {
        elems[i].innerHtml = "By: " + ppl.person[i].age;
    }
    That way your loop doesn't try to process elems.length.innerHTML
    Stephen J Chapman

    javascriptexample.net, Book Reviews, follow me on Twitter
    HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
    <input name="html5" type="text" required pattern="^$">

  4. #4
    SitePoint Guru
    Join Date
    Jun 2009
    Posts
    825
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    thank you very much for both responses.. I can work w/this..

  5. #5
    Non-Member
    Join Date
    Apr 2004
    Location
    Miami, FL, USA
    Posts
    448
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by felgall View Post
    They are nodelists not objects so you should NOT be using for.in as it will process the length along with the nodes.

    Code:
    var elems = document.getElementsByTagName("h5");
    for (var i=elems.length-1; i >=0; i--) {
        elems[i].innerHtml = ppl.person[i].age;
    }
    elems = document.getElementsByTagName("p");
    for (i=elems.length-1; i >=0; i--) {
        elems[i].innerHtml = "By: " + ppl.person[i].age;
    }
    That way your loop doesn't try to process elems.length.innerHTML
    Right... been a while since I've used straight DOM lol. Thanks.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •