Création d'un élément et insertBefore ne fonctionne pas

Question

Ok, je l'ai été cogner ma tête contre le mur et je n'ai aucune idée pourquoi il ne crée pas l'élément. Peut-être quelque chose de très petit que je négligé ici. En gros, il y a ce code Javascript qui est dans un document PHP étant émis, comme quelque part au milieu du moment où la page est chargée, maintenant, malheureusement, il ne peut pas aller dans l'en-tête. Bien que je ne suis pas sûr que ce soit le problème de toute façon, mais peut-être est ... hmmmmm.

// Setting the variables needed to be set.
    echo '
        <script type="text/javascript" src="' . $settings['default_theme_url'] . '/scripts/shoutbox.js"></script>';
    echo '
        <script type="text/javascript">
            var refreshRate = ', $params['refresh_rate'], ';
            createEventListener(window);
            window.addEventListener("load", loadShouts, false);

            function loadShouts()
            {
                var alldivs = document.getElementsByTagName(\'div\');
                var shoutCount = 0;
                var divName = "undefined";

                for (var i = 0; i<alldivs.length; i++)
                {
                    var is_counted = 0;
                    divName = alldivs[i].getAttribute(\'name\');

                    if (divName.indexOf(\'dp_Reserved_Shoutbox\') < 0 && divName.indexOf(\'dp_Reserved_Counted\') < 0)
                        continue;
                    else if(divName == "undefined") 
                        continue;
                    else
                    {
                        if (divName.indexOf(\'dp_Reserved_Counted\') == 0)
                        {
                            is_counted = 0;
                            shoutCount++;
                            continue;
                        }
                        else
                        {
                            shoutCount++;
                            is_counted = 1;
                        }
                    }

                    // Empty out the name attr.
                    alldivs[i].name = \'dp_Reserved_Counted\';

                    var shoutId = \'shoutbox_area\' + shoutCount;

                    // Build the div to be inserted.
                    var shoutHolder = document.createElement(\'div\');
                    shoutHolder.setAttribute(\'id\', [shoutId]);
                    shoutHolder.setAttribute(\'class\', \'dp_control_flow\');
                    shoutHolder.style.cssText = \'padding-right: 6px;\';
                    alldivs[i].parentNode.insertBefore(shoutHolder, alldivs[i]);

                    if (is_counted == 1)
                    {
                        startShouts(refreshRate, shoutId);
                        break;
                    }
                }
            }

        </script>';

En outre, je suis sûr que les autres fonctions que je liant à l'intérieur de ces fonctions fonctionnent très bien. Le problème ici est que, dans cette fonction, le div ne se crée du tout et je ne peux pas comprendre pourquoi? De plus Firefox, Firebug me dit que n'est pas défini la divName variable même si j'ai essayé de prendre soin de ce dans la fonction, mais ne sais pas pourquoi.

Quoi qu'il en soit, j'ai besoin créé élément div à insérer juste avant le code HTML suivant:

echo '
            <div name="dp_Reserved_Shoutbox" style="padding-bottom: 9px;"></div>';

J'utilise le nom ici au lieu d'id parce que je ne veux pas les valeurs en double id qui est la raison pour laquelle je change la valeur du nom et incrémenter, étant donné que cette fonction peut être appelée plus de 1 fois. Par exemple, s'il y a 3 shoutboxes sur la même page (Ne demandez pas pourquoi ... lol), je dois sauter les autres noms que je l'ai déjà changé à « dp_Reserved_Counted », que je crois que je fais correctement. Dans tous les cas, si je pouvais, je mettrais cela dans l'en-tête et l'ont appelé juste une fois, mais ce n'est pas possible que ceux-ci sont chargés et aucun moyen de dire que l'on est qu'ils sont, il est directement codé en dur dans le réel sortie sur la page où l'shoutbox est dans le code HTML. En gros, pas sûr si tel est le problème ou non, mais il doit y avoir une sorte de travail autour, à moins que le problème est dans mon code ci-dessus ... Arrg

S'il vous plaît aidez-moi. Vraiment ce que je dois une deuxième série d'yeux à ce sujet. Merci:)

Answer 1

Il y avait un certain nombre de problèmes dans la méthode loadShouts. Tout d'abord être la comparaison d'une chaîne « non défini » au lieu d'un chèque booléen droite, qui correspondra. J'ai aussi enlevé un tas de logique non nécessaire. Au-delà, l'attribut id étant affecté à la nouvelle shoutHolder a été adoptée en tant que tableau, au lieu d'une affectation de propriété directe .. Voir si mieux les œuvres suivantes.

function loadShouts()
{
  var alldivs = document.getElementsByTagName("div");
  var shoutCount = 0;
  var divName = "undefined";

  for (var i = 0; i<alldivs.length; i++)
  {
    divName = alldivs[i].getAttribute("name");

    if (!divName)
      continue;
    if (divName.indexOf("dp_Reserved_Shoutbox") < 0 && divName.indexOf("dp_Reserved_Counted") < 0)
      continue;

    shoutCount++;    
    if (divName.indexOf("dp_Reserved_Counted") == 0)
      continue;

    // Empty out the name attr.
    alldivs[i].setAttribute("name", "dp_Reserved_Counted");

    var shoutId = "shoutbox_area" + shoutCount;

    // Build the div to be inserted.
    var shoutHolder = document.createElement("div");
    shoutHolder.setAttribute("id", shoutId);
    shoutHolder.setAttribute("class", "dp_control_flow");
    shoutHolder.style.cssText = "padding-right: 6px;";
    alldivs[i].parentNode.insertBefore(shoutHolder, alldivs[i]);

    startShouts(refreshRate, shoutId);
    break;
  }
}

Answer 2

Lorsque vous testez divName, changer l'ordre de vos conditions de cette

                divName = alldivs[i].getAttribute(\'name\');

                if (divName.indexOf(\'dp_Reserved_Shoutbox\') < 0 && divName.indexOf(\'dp_Reserved_Counted\') < 0)
                    continue;
                else if(divName == "undefined") 
                    continue;

à ceci:

                var divName = alldivs[i].getAttribute(\'name\');
                if (!divName) // this is sufficient, by the way
                    continue;
                else if (divName.indexOf(\'dp_Reserved_Shoutbox\') < 0 && divName.indexOf(\'dp_Reserved_Counted\') < 0)
                    continue;

Le problème est que lorsque le script trouve un div sans nom, il essaie d'appeler la propriété indexOf d'une valeur inexistante et jette donc une erreur.

Answer 3

Ok, je voulais juste vous faire savoir comment ça se passait. Et je remercie tous les deux vous beaucoup Tracker1 et Casey espoir. Surtout Tracker pour l'excellente réécriture de la fonction. Vous avez tous ROCK. Voici la dernière fonction que j'utilise Bytheway, juste un tout petit peu de l'édition à la réponse de Tracker1, ce qui est la raison pour laquelle vous avez obtenu mes mains vers le bas vote!

echo '
    <script type="text/javascript">
        var refreshRate = ' . $params['refresh_rate'] . ';
        createEventListener(window);
        window.addEventListener("load", loadShouts, false);

        function loadShouts()
        {
          var alldivs = document.getElementsByTagName("div");
          var shoutCount = 0;
          var divName = "undefined";

          for (var i = 0; i<alldivs.length; i++)
          {
            divName = alldivs[i].getAttribute("name");

            if (!divName)
              continue;
            if (divName.indexOf("dp_Reserved_Shoutbox") < 0 && divName.indexOf("dp_Reserved_Counted") < 0)
              continue;

            shoutCount++;    
            if (divName.indexOf("dp_Reserved_Counted") == 0)
              continue;

            // Empty out the name attr.
            alldivs[i].setAttribute("name", "dp_Reserved_Counted");

            var shoutId = "shoutbox_area" + shoutCount;

            // Build the div to be inserted.
            var shoutHolder = document.createElement("div");
            shoutHolder.setAttribute("id", shoutId);
            shoutHolder.setAttribute("class", "dp_control_flow");
            shoutHolder.style.cssText = "padding-right: 6px;";
            alldivs[i].parentNode.insertBefore(shoutHolder, alldivs[i]);

            startShouts(refreshRate, shoutId);
            break;
          }
        }

    </script>';

Merci Encore une fois, vous êtes le meilleur!