can't get the text from a div, neither when I try to use innerHTML or when I try to walk the DOM

Discussion in 'Javascript' started by Jake Barnes, Apr 6, 2006.

  1. Jake Barnes

    Jake Barnes Guest

    In the function below I use a call to Prototype to get some text from
    another webpage and I fill a div with it. You can see the red, narrow
    div halfway down this page:

    http://www.accumulist.com/index.php?whatPage=addAnEntry.php

    You can see the div is full of text. But when I try to get this text, I
    get nothing. When I test for childNodes I get zero, and when I try
    innerHTML I get nothing. Prototype is suppose to update the innerHTML
    of the target div, so that should work, but it is not.

    I can see the text on screen, so why am I not able to capture it with
    my script?



    unction getPopularTagsFromAccumulist() {
    // 04-06-06 - when people enter a new item into Accumulist.com or
    Mp3Classifieds.com we want
    // the form to auto-suggest to them what some likely categories
    might be. So, for instance,
    // on this page:
    //
    // http://www.accumulist.com/index.php?whatPage=addAnEntry.php
    //
    // where the visitor might type in "General Category" we want to
    suggest something in the same
    // way that flickr and del.icio.us do.
    //
    // The first step in the process is to get the most popular tags in
    the Accumulist database. We
    // will use Prototype to fetch this info for us from this page:
    //
    //
    http://www.accumulist.com/output.php?whatPage=showTagCloudWithCommas&howManyTagsToGet=200
    //
    // but even before that, we must create a place where the result can
    be stored. We don't need
    // to make this container visible on screen.

    var containerForPopularTagsTextArea = document.createElement("div");

    containerForPopularTagsTextArea.id = 'output-div';
    containerForPopularTagsTextArea.style.backgroundColor = "#944";
    containerForPopularTagsTextArea.style.height = "800px;";
    containerForPopularTagsTextArea.style.width = "200px;";

    var refToBody = document.getElementById("main");
    refToBody.appendChild(containerForPopularTagsTextArea);

    var url = "http://www.accumulist.com/output.php";
    var pars = 'whatPage=showTagCloudWithCommas&howManyTagsToGet=200';
    var target = 'output-div';
    var myAjax = new Ajax.Updater(target, url, {method: 'get',
    parameters: pars});

    var refToTagDiv = document.getElementById("output-div");
    var nodeNumber = refToTagDiv.childNodes;
    var contentsOfContainer = refToTagDiv.innerHTML;
    var containerValue = refToTagDiv.value;
    alert ("the number of nodes: " + nodeNumber.length + " and the
    wrods: " + contentsOfContainer + containerValue);
    }
    Jake Barnes, Apr 6, 2006
    #1
    1. Advertising

  2. Jake Barnes

    Jake Barnes Guest

    I mean, its a little surreal. If you go to this page you can see the
    red box with text:

    http://www.accumulist.com/index.php?whatPage=addAnEntry.php

    and yet nothing I do can get the contents of that box:

    var refToTagDiv = document.getElementById("output-div");
    var nodeNumber = refToTagDiv.childNodes;
    var contentsOfContainer = refToTagDiv.innerHTML;
    var containerValue = refToTagDiv.value;
    alert ("the number of nodes: " + nodeNumber.length + " and the wrods:
    " + contentsOfContainer + containerValue);

    The box reports having zero childNodes, blank innerHTML and when I try
    "value" (a long shot at best) I get 'undefined'. I can see the text
    with my eyes, but nothing I do seems able to capture it.





    Jake Barnes wrote:
    > In the function below I use a call to Prototype to get some text from
    > another webpage and I fill a div with it. You can see the red, narrow
    > div halfway down this page:
    >
    > http://www.accumulist.com/index.php?whatPage=addAnEntry.php
    >
    > You can see the div is full of text. But when I try to get this text, I
    > get nothing. When I test for childNodes I get zero, and when I try
    > innerHTML I get nothing. Prototype is suppose to update the innerHTML
    > of the target div, so that should work, but it is not.
    >
    > I can see the text on screen, so why am I not able to capture it with
    > my script?
    >
    >
    >
    > unction getPopularTagsFromAccumulist() {
    > // 04-06-06 - when people enter a new item into Accumulist.com or
    > Mp3Classifieds.com we want
    > // the form to auto-suggest to them what some likely categories
    > might be. So, for instance,
    > // on this page:
    > //
    > // http://www.accumulist.com/index.php?whatPage=addAnEntry.php
    > //
    > // where the visitor might type in "General Category" we want to
    > suggest something in the same
    > // way that flickr and del.icio.us do.
    > //
    > // The first step in the process is to get the most popular tags in
    > the Accumulist database. We
    > // will use Prototype to fetch this info for us from this page:
    > //
    > //
    > http://www.accumulist.com/output.php?whatPage=showTagCloudWithCommas&howManyTagsToGet=200
    > //
    > // but even before that, we must create a place where the result can
    > be stored. We don't need
    > // to make this container visible on screen.
    >
    > var containerForPopularTagsTextArea = document.createElement("div");
    >
    > containerForPopularTagsTextArea.id = 'output-div';
    > containerForPopularTagsTextArea.style.backgroundColor = "#944";
    > containerForPopularTagsTextArea.style.height = "800px;";
    > containerForPopularTagsTextArea.style.width = "200px;";
    >
    > var refToBody = document.getElementById("main");
    > refToBody.appendChild(containerForPopularTagsTextArea);
    >
    > var url = "http://www.accumulist.com/output.php";
    > var pars = 'whatPage=showTagCloudWithCommas&howManyTagsToGet=200';
    > var target = 'output-div';
    > var myAjax = new Ajax.Updater(target, url, {method: 'get',
    > parameters: pars});
    >
    > var refToTagDiv = document.getElementById("output-div");
    > var nodeNumber = refToTagDiv.childNodes;
    > var contentsOfContainer = refToTagDiv.innerHTML;
    > var containerValue = refToTagDiv.value;
    > alert ("the number of nodes: " + nodeNumber.length + " and the
    > wrods: " + contentsOfContainer + containerValue);
    > }
    Jake Barnes, Apr 7, 2006
    #2
    1. Advertising

  3. Jake Barnes

    Jake Barnes Guest

    Okay, I figured this one out myself - I was looking for the answer
    before the answer had returned from the server. With this asynchronous
    stuff, it is important to make sure the call to the server has
    returned, before you go looking for some value.


    Jake Barnes wrote:
    > In the function below I use a call to Prototype to get some text from
    > another webpage and I fill a div with it. You can see the red, narrow
    > div halfway down this page:
    >
    > http://www.accumulist.com/index.php?whatPage=addAnEntry.php
    >
    > You can see the div is full of text. But when I try to get this text, I
    > get nothing. When I test for childNodes I get zero, and when I try
    > innerHTML I get nothing. Prototype is suppose to update the innerHTML
    > of the target div, so that should work, but it is not.
    >
    > I can see the text on screen, so why am I not able to capture it with
    > my script?
    >
    >
    >
    > unction getPopularTagsFromAccumulist() {
    > // 04-06-06 - when people enter a new item into Accumulist.com or
    > Mp3Classifieds.com we want
    > // the form to auto-suggest to them what some likely categories
    > might be. So, for instance,
    > // on this page:
    > //
    > // http://www.accumulist.com/index.php?whatPage=addAnEntry.php
    > //
    > // where the visitor might type in "General Category" we want to
    > suggest something in the same
    > // way that flickr and del.icio.us do.
    > //
    > // The first step in the process is to get the most popular tags in
    > the Accumulist database. We
    > // will use Prototype to fetch this info for us from this page:
    > //
    > //
    > http://www.accumulist.com/output.php?whatPage=showTagCloudWithCommas&howManyTagsToGet=200
    > //
    > // but even before that, we must create a place where the result can
    > be stored. We don't need
    > // to make this container visible on screen.
    >
    > var containerForPopularTagsTextArea = document.createElement("div");
    >
    > containerForPopularTagsTextArea.id = 'output-div';
    > containerForPopularTagsTextArea.style.backgroundColor = "#944";
    > containerForPopularTagsTextArea.style.height = "800px;";
    > containerForPopularTagsTextArea.style.width = "200px;";
    >
    > var refToBody = document.getElementById("main");
    > refToBody.appendChild(containerForPopularTagsTextArea);
    >
    > var url = "http://www.accumulist.com/output.php";
    > var pars = 'whatPage=showTagCloudWithCommas&howManyTagsToGet=200';
    > var target = 'output-div';
    > var myAjax = new Ajax.Updater(target, url, {method: 'get',
    > parameters: pars});
    >
    > var refToTagDiv = document.getElementById("output-div");
    > var nodeNumber = refToTagDiv.childNodes;
    > var contentsOfContainer = refToTagDiv.innerHTML;
    > var containerValue = refToTagDiv.value;
    > alert ("the number of nodes: " + nodeNumber.length + " and the
    > wrods: " + contentsOfContainer + containerValue);
    > }
    Jake Barnes, Apr 7, 2006
    #3
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Marcus Alves Grando
    Replies:
    7
    Views:
    453
    Marcus Alves Grando
    Nov 14, 2007
  2. mscir
    Replies:
    3
    Views:
    294
    Martin Honnen
    Jun 26, 2005
  3. sonic
    Replies:
    5
    Views:
    266
    Randy Webb
    Jul 11, 2006
  4. Jake Barnes
    Replies:
    3
    Views:
    147
    Jake Barnes
    Sep 10, 2007
  5. david.karr
    Replies:
    4
    Views:
    204
Loading...

Share This Page