jquery anchor to html extract

Question

I would like to implement something similar to the Google quick scroll extension with jquery for the extracts of a search result, so when the full document is opened (within the same website) it gives the user the opportunity to go straight to the extract location.

Here is a sample of what I get returned from the search engine when I search for 'food'.

<doc>
  <docid>129305</docid>
  <title><span class='highlighted'>Food</span></title>
  <summary>
    <summarytext>Papers subject to Negative Resolution:    4 <span class='highlighted'>Food</span>        <span class='highlighted'>Food</span> Irradiation (England) Regulations 2009 (S.I.,  2009,  No.  1584),  dated 24 June 2009 (by Act), </summarytext>
  </summary>
  <paras>
    <paraitemcount>2</paraitemcount>
    <para>
      <paraitem>1</paraitem>
      <paraid>42</paraid>
      <pararelevance>100</pararelevance>
      <paraweights>50</paraweights>
      <paratext>4 <span class='highlighted'>Food</span></paratext>
    </para>
    <para>
      <paraitem>2</paraitem>
      <paraid>54</paraid>
      <pararelevance>100</pararelevance>
      <paraweights>50</paraweights>
      <paratext><span class='highlighted'>Food</span> Irradiation (England) Regulations 2009 (S.I.,  2009,  No.  1584),  dated 24 June 2009 (by Act),  with an Explanatory Memorandum and an Impact Assessment (</paratext>
    </para>
  </paras>
</doc>

As you see the search engine has returned a document that contains one summary and two extracts.

So let's say the user clicks on the second extract in the search resutls page, the browser would open the detailed document in the same website, and would offer the user the possibility to go to the extract as the Google quick scroll extension does.

Is there an existing jquery script for this? If not, can you suggest any jquery/javascript code that would simplify my task to implement this.

Notes:

• I can access the extracts from the document details page.
• I'm aware that the HTML in some cases could be slightly different in the extract than in the details page, finding no match.
• The search engine does not return where the extract was located.
• At the moment I'm trying to understand the JS code that the extension uses.

Answer 1

I don't quite understand the details, what and where you have in your app and where is your JS (is the given doc in a frame or in the same doc?). Basically, if you have a server-side application, you need to form a link in JQuery like /highlighter.php?search=Food#2 and put in the highlighted document an anchor.

If you need to do this with JQuery only, then I guess

<frame name="hl" src="original.document" />

and JS in the main page (that hosts the frames):

$(hl.document.body).html($(hl.document.body).html().replace('Food', '<a name=\'entry2\'></a><span class=\'highlighted\'>Food</span>'))
hl.location = hl.location + '#entry2'

Answer 2

You can examine the javascript used in the chrome extension, since extensions are just regular web content.

In Vista, the path is: C:\Users\[YOUR_USER_NAME]\AppData\Local\Google\Chrome\User Data\Default\Extensions\okanipcmceoeemlbjnmnbdibhgpbllgc

In XP, the path is: C:\Documents and Settings\[YOUR_USER_NAME]\Local Settings\Application Data\Google\Chrome\User Data\Default\Extensions\okanipcmceoeemlbjnmnbdibhgpbllgc

Where okanipcmceoeemlbjnmnbdibhgpbllgc is the extension's unique ID.