Toggling Content in SPAN element, One is Text Node, Other Document Fragment

Discussion in 'Javascript' started by User Access Approved, Oct 15, 2004.

  1. I am having a bit of trouble with code that toggles a SPAN element (with
    id="sourcetype") between two content nodes. The toggle is determined by
    radio type INPUT controls, whose ONCHANGE event is supposed to call a
    function that sets the content of the SPAN element. The one content node
    is a simple Text node, while the other is actually a Document Fragment
    node.

    When the radio button "ESI+" is set (checked true), the SPAN element
    content is supposed to be "ESI+". When the button is set "ESI-", the
    SPAN element is supposed to be set to contain "ESI\u2212"

    Errors occur at the replaceChild() method call, from what I can tell.

    When I changed the initialization script at the bottom of the document
    BODY, so that variable 'ESInegTxtNode' was created through
    document.createTextNode('ESI' + minus_char), the browsers did not give
    the errors I was getting before.

    Thus, the replaceChild() method could not take the Document Fragment
    node, but could take a Text node. That does not seem right to me, since
    any Node type is an acceptable parameter.

    ===================================================

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"
    "http://www.w3.org/TR/REC-html40/loose.dtd">
    <html>
    <head>
    <title>QToF Interactive Guide</title>
    <style type="text/css">
    @media print { body { font-size:12pt; }
    table, tr { border:2px solid silver;} }
    @media screen {
    body { background-color:#f8fff8; margin:2em 10%;line-height:1.2em;
    }
    }
    table { margin:1em 0; background-color:#aaa; }
    th, td { padding:0.1em 0.25em;}
    th { background-color:#ffe8e8;font:bold 90% Helvetica,Arial,sans-
    serif;}
    td { background-color:#e8e8ff;font:normal 100% Helvetica,Arial,sans-
    serif; }
    #title {text-align:center;font:bold 150% Tahoma,Arial,sans-serif;color:
    #aa3377;}
    </style>
    <script type="text/javascript">
    var browser = "";
    if (document.all)
    browser = "ie";

    // CONSTANTS in Unicode
    var minus_char = "\u2212";


    function sourceChanged(radioButton)
    {
    var t = document.getElementById("sourcetype");
    if (radioButton.value == "ESI-" && radioButton.checked == true)
    ESIposTxtNod = t.replaceChild(ESInegTxtNod, ESIposTxtNod);
    else if (radioButton.value == "ESI+" && radioButton.checked == true)
    ESInegTxtNod = t.replaceChild(ESIposTxtNod, ESInegTxtNod);
    }

    /* if (browser == "ie")
    t.innerHTML = "ESI+";
    else
    if (browser = "ie")
    t.innerHTML = "ESI" + minus_char;
    else */

    </script>
    </head>
    <body>
    <p id="title">
    QToF Interactive Guide
    <p>
    <table>
    <tr><td class="tdradio">
    <input type="radio" name="ESIset" value="ESI+" checked
    onchange="sourceChanged(this);">positive source (ESI+)
    <br><input type="radio" name="ESIset" value="ESI-"
    onchange="sourceChanged(this);">negative source (ESI&minus;)
    <tr><td><span id="sourcetype"></span>
    </table>
    <script type="text/javascript">
    var ESInegTxtNod = document.createDocumentFragment();
    var ESIposTxtNod = document.createTextNode("ESI+");
    ESInegTxtNod.appendChild(document.createTextNode("ESI" +
    minus_char));
    document.getElementById("sourcetype").appendChild(ESIposTxtNod);
    </script>
    </body>
    </html>
     
    User Access Approved, Oct 15, 2004
    #1
    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. Bryan Ax
    Replies:
    6
    Views:
    547
    Peter Flynn
    May 17, 2006
  2. Tjerk Wolterink
    Replies:
    2
    Views:
    1,437
    Dimitre Novatchev
    Aug 24, 2006
  3. Rajarshi
    Replies:
    1
    Views:
    539
    Gabriel Genellina
    Feb 11, 2007
  4. HANM
    Replies:
    2
    Views:
    721
    Joseph Kesselman
    Jan 29, 2008
  5. Wang, Jay
    Replies:
    5
    Views:
    475
    Wang, Jay
    May 25, 2004
Loading...

Share This Page