开发者

Trying to figure out this JavaScript bookmarklet

开发者 https://www.devze.com 2023-02-19 08:24 出处:网络
I`m a JavaScript/programming newbie trying to figure out the new bookmarklet that\'s been released to help overcome the new NY Times paywall, available at this blog http://euri.ca/2011/03/21/get-aroun

I`m a JavaScript/programming newbie trying to figure out the new bookmarklet that's been released to help overcome the new NY Times paywall, available at this blog http://euri.ca/2011/03/21/get-around-new-york-times-20-article-limit/

It`s only the following 3 lines of JavaScript....

 //Prototype is already installed on NYTimes pages, so I'll use that:
    $('overlay').hide();
    $('gatewayCreative').hide();
    $(document.body).setStyle( { overflow:'scroll' } );

so I thought it would be a not overly complex wa开发者_开发技巧y to learn about practical uses of JavaScript

When I click on the source code for the actual bookmarklet, it revealed this

<a href="javascript:(function() {var s=document.createElement('script');s.setAttribute('src','http://toys.euri.ca/nyt.js');document.getElementsByTagName('head')[0].appendChild(s);})();" class="supercoolbutton">NYTClean</a>

The three lines of JavaScript above are located at 'http://toys.euri.ca/nyt.js'

My questions are

a) when he says that Prototype is already installed on NYTimes page, is he referring to the Prototype library, so his code is just altering what they did with the library?

b) in the source code for the bookmarklet, where he does document.getElementsByTagName('head')[0].appendChild(s);})();" does the document refer to the NY Times page that the reader will be on? and 'head' refer to an Element in the NYTimes home page, to which he is appending the child s?

c) is the source code for the bookmarklet wrapped in the link so that appendChild(s) only happens when you click on the link/bookmarklet. Is a bookmark essentially a link which runs code?

d) do you know of a resource that explains how to make the actual bookmarklet which can be dragged from a webpage to the bookmark bar? That drag-to-the-bookmark bar feature is obviously separate from the code it contains, so do you know where I can learn it if I wanted to make my own bookmark to experiment with JavaScript.


a) Yes, he's referring to the Prototype javascript library.

b&c) The way bookmarklets work is by running javascript in the context of a given website by using the "javascript:" protocol. You can run anything you want this way (try typing "javascript:alert('the title is: ' + document.title);" in your address bar and hitting enter. You should get an alert showing you the title of the page you're on. You might consider reading up a bit on how they work on wikipedia.

d) The drag-bookmarklet-to-bar functionality that bookmarklets depend on is actually built in to your web browser. To make an installable bookmarklet that will work on any modern browser, all you have to do is have:

<a href="javascript:[bookmarklet code here]">Drag to bookmark bar to install!</a>
0

精彩评论

暂无评论...
验证码 换一张
取 消