extracting part of a document

Discussion in 'Javascript' started by Une Bévue, Oct 17, 2006.

  1. Une Bévue

    Une Bévue Guest

    the purpose :

    avoid all banners and unusefull contents of an html document the leaves
    intact the part from start to body and inside the body leave only the
    part where user has clicked (by mousedown -- mousemove --> mouseup)).

    for example a schematic document as input :

    <html><title>...<meta<<link to csss, javascript ect>
    <body...>
    <div id="one">div one contents </div>
    <div id="two">div two contents </div>
    <div id="three">div three contents </div>
    </body>
    <.html>

    suppose the user clicked down and up into div "two", i want to
    transform (in-place) the given document into :

    <html><title>...<meta<<link to csss, javascript ect>
    <body...>
    <div id="two">div two contents </div>
    </body>
    <.html>

    then leaving only div two inside the body.

    i've started to work about that (not successfully)

    following :
    <http://www.quirksmode.org/js/events_mouse.html>
    and :
    <http://www.quirksmode.org/dom/getElementsByTagNames.html>

    where iI did extract a usefull function, to me :

    --- getElementsByTagNames(list,obj) ---
    function getElementsByTagNames(list,obj) {
    nb_calls++;
    if (!obj) var obj = document.body;
    var tagNames = list.split(',');
    var resultArray = new Array();
    var tags;
    for (var i=0;i<tagNames.length;i++) {
    tags = obj.getElementsByTagName(tagNames);
    nb_tags+=tags.length;
    for (var j=0;j<tags.length;j++) {
    resultArray.push(tags[j]);
    nb_loop++;
    }
    }
    return resultArray;
    }
    -----------------------------------------------------

    here are the probs i get )))

    with an html page as mentionned above having 5 divs inside the body, in
    order to simulate a "real life" document :
    div banner, div left, div extract, div right and div footer.

    the div extract dom structure being ;

    --- div#extract ----------------------------------------
    <div id="extract">
    <h3 id="click">Mousedown, mouseup, click</h3>

    <p>...</p>

    <ol>
    <li><code>...</code>...</li>
    <li><code>...</code>,...</li>
    <li><code>...</code>...
    <code>...</code>...<code>...</code>...</li>
    </ol>

    <p>... <code>...</code> ...<code>...</code>
    ....<code>...</code>...<code>...</code>....<code>...</code>...</p>

    <p>...<code>...</code>... <code>...</code> ....</p>

    <p>...<code>...</code>...<code>click</code>...</p>

    <p>...</p>
    </div>
    -----------------------------------------------------------


    if, on this div extract i do :

    extract=document.getElementById("extract")
    then :
    elts_extract=getElementsByTagNames(the_list,extract);
    with :
    var the_list="div, h1, h2, h3, h4, h5, p, img, ul, li, table, pre"

    i get NO elements at all using the function
    "getElementsByTagNames(list,obj)"

    notice that the vars : nb_calls, nb_tags and nb_loop are there only
    for debuging.

    in case someone have some light abour that...
     
    Une Bévue, Oct 17, 2006
    #1
    1. Advertising

  2. Une Bévue

    Une Bévue Guest

    FOUND was (Re: extracting part of a document)

    Une Bévue <> wrote:

    > the purpose :

    <snip/>
    > in case someone have some light abour that...

    found a solution here irs is :
    <http://thoraval.yvon.free.fr/JavaScript/extract.html>
     
    Une Bévue, Oct 17, 2006
    #2
    1. Advertising

  3. Une Bévue

    RobG Guest

    Une Bévue wrote:
    > the purpose :
    >
    > avoid all banners and unusefull contents of an html document the leaves
    > intact the part from start to body and inside the body leave only the
    > part where user has clicked (by mousedown -- mousemove --> mouseup)).
    >
    > for example a schematic document as input :
    >
    > <html><title>...<meta<<link to csss, javascript ect>
    > <body...>
    > <div id="one">div one contents </div>
    > <div id="two">div two contents </div>
    > <div id="three">div three contents </div>
    > </body>
    > <.html>
    >
    > suppose the user clicked down and up into div "two", i want to
    > transform (in-place) the given document into :
    >
    > <html><title>...<meta<<link to csss, javascript ect>
    > <body...>
    > <div id="two">div two contents </div>
    > </body>
    > <.html>
    >
    > then leaving only div two inside the body.
    >
    > i've started to work about that (not successfully)


    That's enough. Once you have a reference to div two, you can remove
    all the body's child nodes, then re-attache div two:


    function trimBody (htmlElement){
    var docBody = document.body;
    while ( docBody.firstChild ){
    docBody.removeChild( docBody.firstChild );
    }
    docBody.appendChild( htmlElement );
    }

    Your method of getting elements by tag name will result in a set of
    node collections, you have destroyed the structure and don't know how
    to put it back. The above maintains the structure:

    <script type="text/javascript">

    function trimBody(htmlElement){
    var docBody = document.body;
    while (docBody.firstChild){
    docBody.removeChild(docBody.firstChild);
    }
    docBody.appendChild(htmlElement);
    }

    </script>
    <body>
    <div id="one" onclick="trimBody(this);">
    <p>Click here to keep just div <b>one</b>
    </div>
    <div id="two" onclick="trimBody(this);">
    <p>Click here to keep just div <b>two</b>
    </div>
    <div id="three" onclick="trimBody(this);">
    <p>Click here to keep just div <b>three</b>
    </div>
    </body>

    --
    Rob
     
    RobG, Oct 17, 2006
    #3
  4. Une Bévue

    Une Bévue Guest

    RobG <> wrote:

    >
    > That's enough. Once you have a reference to div two, you can remove
    > all the body's child nodes, then re-attache div two:
    >

    <snip/>

    yes fine thanks, i've found it see above in this thread my
    auto-answer...
     
    Une Bévue, Oct 17, 2006
    #4
  5. Une Bévue

    RobG Guest

    Une Bévue wrote:
    > RobG <> wrote:
    >
    > >
    > > That's enough. Once you have a reference to div two, you can remove
    > > all the body's child nodes, then re-attache div two:
    > >

    > <snip/>
    >
    > yes fine thanks, i've found it see above in this thread my
    > auto-answer...


    OK, but don't believe the junk about "Safari bug": any node that
    supports the event interface can be an event target, it's just that
    webkit browsers have implemented it on text nodes where other browsers
    haven't.

    I think my method of removing child nodes is more efficient... you are
    free to chose. :)

    --
    Rob
     
    RobG, Oct 17, 2006
    #5
  6. Une Bévue

    Une Bévue Guest

    RobG <> wrote:

    >
    > I think my method of removing child nodes is more efficient... you are
    > free to chose. :)


    yes fine, i'm able to change my mind ;-)

    yes right your while loop is more clever than my for one, i do agree but
    i don't understand why my version would "destroyed the structure" ?

    i think i've notice i did taht in reverse order (from last to first) ???

    new version on line :
    <http://thoraval.yvon.free.fr/JavaScript/trim_body.html>
     
    Une Bévue, Oct 17, 2006
    #6
  7. Une Bévue

    RobG Guest

    Une Bévue wrote:
    > RobG <> wrote:
    >
    >> I think my method of removing child nodes is more efficient... you are
    >> free to chose. :)

    >
    > yes fine, i'm able to change my mind ;-)
    >
    > yes right your while loop is more clever than my for one, i do agree but
    > i don't understand why my version would "destroyed the structure" ?


    Using getElementsByTagNames created an array of elements that was not
    the same as the original structure, I assumed you were going to just put
    them back in the same order as the array, not where they started from.

    It failed because your list of tag names was:

    "div, h1, h2, h3, ..."

    There were no div's inside div extract, and the other tags have leading
    spaces so you were trying to match " h1" rather than "h1", etc.

    > i think i've notice i did taht in reverse order (from last to first) ???


    It seems you were doing 0 to i'th, but that is not relevant. The array
    of elements is not the same structure as the original HTML, it's been
    destroyed by collecting all the elements with the same tag name together.

    >
    > new version on line :
    > <http://thoraval.yvon.free.fr/JavaScript/trim_body.html>


    Works fine (even in Safari) :)

    --
    Rob
     
    RobG, Oct 17, 2006
    #7
  8. Une Bévue

    Une Bévue Guest

    RobG <> wrote:

    > It seems you were doing 0 to i'th, but that is not relevant. The array
    > of elements is not the same structure as the original HTML, it's been
    > destroyed by collecting all the elements with the same tag name together.


    ok, i've understood now what u mean.

    >
    > >
    > > new version on line :
    > > <http://thoraval.yvon.free.fr/JavaScript/trim_body.html>

    >
    > Works fine (even in Safari) :)


    yes i even try it with Webkit the latest nightly build (doesn't give the
    same height for the divs...)

    right now i do have to write a ruby script in order to put this line
    somewhere in the head :

    <script type="text/javascript" src="js/trim_body.js"></script>

    not a big tuff.

    and test over any given page...
     
    Une Bévue, Oct 17, 2006
    #8
    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. =?Utf-8?B?S2V2aW4gSw==?=
    Replies:
    2
    Views:
    2,919
    =?Utf-8?B?S2V2aW4gSw==?=
    Apr 6, 2006
  2. Max
    Replies:
    6
    Views:
    6,098
    Malcolm Dew-Jones
    Sep 17, 2004
  3. puzzlecracker

    extracting part of xml

    puzzlecracker, Feb 16, 2006, in forum: Java
    Replies:
    10
    Views:
    2,435
    puzzlecracker
    Feb 25, 2006
  4. Jack
    Replies:
    8
    Views:
    294
  5. Karlo Lozovina

    Extracting part of strings?

    Karlo Lozovina, Dec 15, 2004, in forum: Perl Misc
    Replies:
    7
    Views:
    149
    Peter Wyzl
    Dec 16, 2004
Loading...

Share This Page