SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Member
    Join Date
    Sep 2006
    Posts
    4
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    InsertBefore - HELP!

    Ok, I'm trying to do the following through DOM (which, I admittedly have little to no knowledge of)

    Insert a link just before the beginning of the table with known ID 'list'

    For example:
    HTML Code:
    <table id="list">
    <tr>
    <td>stuff here</td>
    </tr>
    </table>
    What I want, is to through DOM, insert a link just before the beginning of this table. Looking through the web, I've come across insertBefore, which I've played with, but obviously don't get.

    Example of what I tried to do:
    PHP Code:

    $link 
    '<a href="url here">Link</a>';

        echo(
    '<script type="text/javascript">'.n.
            
    "<!--".n.
            
    "var e = document.getElementById('list');".n.
            
    "var n = document.createElement('p');".n.
            
    "n.innerHTML = '"$link ."';".n.
            
    "document.insertBefore(n,e);".n.
            
    "n.setAttribute('id','tag_email');".n.
            
    "// -->".n.
            
    "</script>"); 
    This unfortunately, does nothing.

  2. #2
    SitePoint Wizard
    Join Date
    Nov 2004
    Location
    Nelson BC
    Posts
    2,310
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    var myNewElement = ....
    var list = document.getElementById("list");
    list.parentNode.insertBefore(myNewElement, list);

  3. #3
    SitePoint Member
    Join Date
    Sep 2006
    Posts
    4
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by jimfraser
    var myNewElement = ....
    var list = document.getElementById("list");
    list.parentNode.insertBefore(myNewElement, list);
    I tried the following without any success:
    PHP Code:
     $link '<a href="url here">Link</a>';

        echo(
    '<script type="text/javascript">'.n.
            
    "<!--".n.
            
    'var myNewElement = "'.$link.'"'.n.
            
    'var list = document.getElementById("list");'.n.
            
    'list.parentNode.insertBefore(myNewElement, list);'.n.
            
    "//-->".n.
            
    "</script>"); 
    What am I doing wrong?

    The above is supposed to be modifying what's below:
    Code:
    <table cellpadding="0" cellspacing="0" border="0" id="list" align="center">
    <tr><td colspan="4" style="border:0"><form enctype="multipart/form-data" action="index.php" method="post">
    I'm really at a loss...

  4. #4
    SitePoint Member
    Join Date
    Sep 2006
    Posts
    4
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Bump..

  5. #5
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,834
    Mentioned
    25 Post(s)
    Tagged
    1 Thread(s)
    The problem is that you have two nodes and an attribute that you are trying to add to the page as if it were one node. The $link field defined as you have it there needs to be added to the page as follows:

    1. Define an <a> node eg.
    var newA = document.createElement("a");

    2. Add an href attribute eg.
    newA.href = 'url here';

    3. Create the text node eg:
    var newT = document.createTextNode('Link');

    4. Append the text node to the anchor node eg.
    newA.appendChild(newT);

    5. Now you can add the new content to the page
    var list = document.getElementById("list");
    list.parentNode.insertBefore(newA, list);
    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="^$">


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
  •