Get Started With Chickenfoot
2012-04-23 00:34
471 查看
Get Started With Chickenfoot | Webmonkey | Wired.com
![](http://scribefire-next/wp-content/uploads/2009/12/chickenfoot.png)
As every budding developer knows,sometimes when the internet fails to give you exactly what you want,you have to hack it yourself. The ability to do this is made easy (and legal) with tools like Chickenfoot,a scripting tool currently available as a plug-in for the Firefox browser. By installing Chickenfoot,you add a scripting layer over your browser and you can start manipulating your browsing experience through some easy-to-learn JavaScript-based coding.
Chickenfoot is similar to Greasemonkey,another Firefox add-on providing page scripting. But it goes a step beyond Greasemonkey by manipulating the browser’s Document Object Model (DOM). The DOM represents the interactive abilities of the web — things like links,text boxes,radio buttons,and check boxes all lay within the DOM. The ability to manipulate the DOM allows you to change the behavior of a website’s code,the way the page lets you interact with it and submissions based on preference or whimsy.
This direct relationship with the DOM is actually where Chickenfoot gets its name. Chickenfoot is the name of a game played with dominoes — DOMinoes? Get it?
Sample applications of Chickenfoot:
Change page colors. Add photos
Automatically fill forms
Automatically navigate around through a website
Change text box sizes
Find the number of links on a page
Scripts can be saved and loaded on demand. It allows you to write code while browsing and then run,or “trigger” it,at any time. Triggers can be set for page actions or whenever the page matches a criteria pattern you set. For example,scripts can be triggered when pages are loaded or when the browser sees particular links.
The Chickenfoot extension’s interface is contained inside a browser sidebar. It includes a text box for on-the-fly scripting,and an area allowing you to see the output and error messages of your scripts. There are a couple tabs at the top of the sidebar which allow you to browse pattern matches and tweak the preferences controlling when your scripts are triggered.
There are some sample scripts bundled with Chickenfoot,including an “icon search” that’s useful for filtering Google image search results for icons. There’s also a script which highlights and defines SAT words,and one which allows you to resize text boxes by dragging a small image in the box’s corner.
Chickenfoot offers some functionality Greasemonkey lacks. Most significantly,scripting in Chickenfoot has an easier learning curve. Easy script commands include functions like "click("This Link"). Manipulating the same type of command in Greasemonkey involves an intermediate level of JavaScript knowledge,a text editor,and a page refresh.
You can get Firefox at Mozilla’s Firefox site.
You can get Chickenfoot at Chickenfoot’s home page
view source
print?
Let’s take that idea a step further. Say I want to set up a script to open Gmail (presuming I’m already logged in to my Google account) and search account for any unread messages. In Chickenfoot,the script would look like.
view source
print?
Chickenfoot will find the best match for the arguments given. However,what if there are multiple search forms on a page? With a little JavaScript know-how,you can specify exactly the right textbox,image or button you want Chickenfoot to interact with. For example,you can specify the DOM using something like.
If the DOM and JavaScript are a little over your head,Chickenfoot makes it easy to write such a script anyway. You can “Record actions” as you perform your desired task,then copy and paste the actions into a script.
![](http://scribefire-next/wp-content/uploads/2009/12/080606-chickenfoot.png)
Other form elements are supported as well. For example,you can use
Let’s say we want to find how many times the word “chickenfoot” appears in this article. We’d write something like this:
view source
print?
The answer would appear in the output field.
This is just one way:
view source
print?
On the bottom of the Chickenfoot sidebar is a tab called “Triggers.” Triggers can be set to activate whenever a page meets the criteria you set. You can set your script to run when it sees a match for a page URL,when a new window opens or when Firefox starts.
To add a trigger,press the “plus” icon at the top of the triggers tab. You may have to expand the width of the sidebar to see icons for adding,editing,and removing triggers.
![](http://scribefire-next/wp-content/uploads/2009/12/080606-chickenfoot-triggers.png)
Notably,the last option on the right of the Trigger tab gives you the ability to package your triggers as stand-alone Firefox extensions. Packaged extensions can be sent to,and installed by,friends who use Firefox — even if they don’t have Chickenfoot installed.
As mentioned above,you can write your scripts directly in JavaScript and port them over to Greasemonkey. Chickenfoot also allows you to port over your Greasemonkey scripts by inserting:
view source
print?
at the top of your script. You can also use the Chickenfoot tool to compose Greasemonkey scripts. To start a new Greasemonkey script in Chickenfoot,click the arrow next to the “New” button and select “Greasemonkey template.”
There’s a Chickenfoot Scripts wiki — a great place to download scripts and learn by example.
Webmonkey has a load of JavaScript tutorials to get you started on the portable scripting language.
Get Started With Chickenfoot
By Webmonkey StaffChickenfoot is a scripting wrapper that allows you to manipulate websites on the fly. By building and running simple scripts in Chickenfoot,you can alter the behavior of your favorite websites and make the pages display and respond in different ways,customizing them to your liking. Best of all,Chickenfoot isn’t difficult to learn or use. The scripts can be created using only your browser (via a downloadable extension) and some light coding.Introduction
![](http://scribefire-next/wp-content/uploads/2009/12/chickenfoot.png)
As every budding developer knows,sometimes when the internet fails to give you exactly what you want,you have to hack it yourself. The ability to do this is made easy (and legal) with tools like Chickenfoot,a scripting tool currently available as a plug-in for the Firefox browser. By installing Chickenfoot,you add a scripting layer over your browser and you can start manipulating your browsing experience through some easy-to-learn JavaScript-based coding.
Chickenfoot is similar to Greasemonkey,another Firefox add-on providing page scripting. But it goes a step beyond Greasemonkey by manipulating the browser’s Document Object Model (DOM). The DOM represents the interactive abilities of the web — things like links,text boxes,radio buttons,and check boxes all lay within the DOM. The ability to manipulate the DOM allows you to change the behavior of a website’s code,the way the page lets you interact with it and submissions based on preference or whimsy.
This direct relationship with the DOM is actually where Chickenfoot gets its name. Chickenfoot is the name of a game played with dominoes — DOMinoes? Get it?
Sample applications of Chickenfoot:
Change page colors. Add photos
Automatically fill forms
Automatically navigate around through a website
Change text box sizes
Find the number of links on a page
Scripts can be saved and loaded on demand. It allows you to write code while browsing and then run,or “trigger” it,at any time. Triggers can be set for page actions or whenever the page matches a criteria pattern you set. For example,scripts can be triggered when pages are loaded or when the browser sees particular links.
The Chickenfoot extension’s interface is contained inside a browser sidebar. It includes a text box for on-the-fly scripting,and an area allowing you to see the output and error messages of your scripts. There are a couple tabs at the top of the sidebar which allow you to browse pattern matches and tweak the preferences controlling when your scripts are triggered.
There are some sample scripts bundled with Chickenfoot,including an “icon search” that’s useful for filtering Google image search results for icons. There’s also a script which highlights and defines SAT words,and one which allows you to resize text boxes by dragging a small image in the box’s corner.
Chickenfoot offers some functionality Greasemonkey lacks. Most significantly,scripting in Chickenfoot has an easier learning curve. Easy script commands include functions like "click("This Link"). Manipulating the same type of command in Greasemonkey involves an intermediate level of JavaScript knowledge,a text editor,and a page refresh.
What you’ll need
You’ll need to be running Firefox and the Chickenfoot add-on. You’ll also need a general understanding of scripting and a good idea for a script you’d like to create.You can get Firefox at Mozilla’s Firefox site.
You can get Chickenfoot at Chickenfoot’s home page
Steps
Step 1: Basic Page Navigation
Basic page navigation is probably the most most unique feature of Chickenfoot. For example,all it takes to open a page,enter a query and press a button is:view source
print?
1 | go( "webmonkey.com" ) |
2 |
3 | enter( "search" , "chickenfoot" ) |
4 |
5 | click( "second button" ) |
view source
print?
1 | go( "http://www.gmail.com" ) |
2 |
3 | enter( "search" , "is:unread" ) |
4 |
5 | click( "Search Mail" ) |
click(new XPath("/HTML[1]/BODY[1]/DIV[1]/DIV[1]/DIV[2]/UL[1]/LI[7]/FORM[1]/INPUT[2]"))
If the DOM and JavaScript are a little over your head,Chickenfoot makes it easy to write such a script anyway. You can “Record actions” as you perform your desired task,then copy and paste the actions into a script.
![](http://scribefire-next/wp-content/uploads/2009/12/080606-chickenfoot.png)
Other form elements are supported as well. For example,you can use
pick("my selection")to select from a drop-down list and
check("my choice")to choose a particular checkbox.
Step 2: Pattern Matching
Want to load and search for strings on a page? Basic page manipulation is possible using built in pattern-matching.Let’s say we want to find how many times the word “chickenfoot” appears in this article. We’d write something like this:
view source
print?
1 | m=find( "chickenfoot" ) |
2 |
3 | m.count |
Step 3: Page Modification
Chickenfoot allows you to change a page’s rendered source code on the fly. For example,let’s say we want to customize an image on a page. Maybe you’d even want to go as far as replacing the Webmonkey logo with an image of your own design.This is just one way:
view source
print?
1 | replace( "http:www.webmonkey.com/logo.gif" , "http://myserver/mylogo.gif" ) |
Step 4: Activating Triggers
Up until this point,we’ve focused on writing ad hoc code from the sidebar. Let’s say we wrote a script we liked and wanted to apply it every time it matched a specific set of criteria.On the bottom of the Chickenfoot sidebar is a tab called “Triggers.” Triggers can be set to activate whenever a page meets the criteria you set. You can set your script to run when it sees a match for a page URL,when a new window opens or when Firefox starts.
To add a trigger,press the “plus” icon at the top of the triggers tab. You may have to expand the width of the sidebar to see icons for adding,editing,and removing triggers.
![](http://scribefire-next/wp-content/uploads/2009/12/080606-chickenfoot-triggers.png)
Notably,the last option on the right of the Trigger tab gives you the ability to package your triggers as stand-alone Firefox extensions. Packaged extensions can be sent to,and installed by,friends who use Firefox — even if they don’t have Chickenfoot installed.
Alternate methods
JavaScript Integration
Chickenfoot scripting is heavily based on JavaScript. If you know JavaScript,you can bypass the easy-to-use Chickenfoot commands and write your functions completely in JavaScript. Scripts written in JavaScript are easily portable across browsers,extensions and platforms.Greasemonkey
As mentioned above,Greasemonkey is an alternative to Chickenfoot for scripting your browser. You can find Greasemonkey at the Mozilla add-on site.As mentioned above,you can write your scripts directly in JavaScript and port them over to Greasemonkey. Chickenfoot also allows you to port over your Greasemonkey scripts by inserting:
view source
print?
1 | include( "greasemonkey.js" ); |
Suggested readings
Chickenfoot’s Quick Start guide is a great place to learn the basics. It also offers a great command library that you can bookmark for reference.There’s a Chickenfoot Scripts wiki — a great place to download scripts and learn by example.
Webmonkey has a load of JavaScript tutorials to get you started on the portable scripting language.
相关文章推荐
- FastDFS的配置、部署与API使用解读(1)Get Started with FastDFS(转)
- Android TV-Building TV Apps,Get Started with TV Apps
- 【学习笔记】Get Started with MATLAB-Chapter01
- FastDFS的配置、部署与API使用解读(1)Get Started with FastDFS
- Get Started with ElasticSearch and Wicket
- [Angular] Get started with data binding and SPA
- Get started with Android fragments
- [读书笔记]A Programmer's Guide to Data Mining - chapter 2 Get Started with Recommendation Systems
- FastDFS的配置、部署与API使用解读(1)Get Started with FastDF
- Get Started with the A* Pathfinding Project
- FastDFS的配置、部署与API使用解读(1)Get Started with FastDFS
- How do I get started with Node.js
- Get started with Google Analytics
- How to get started with WebRTC
- FastDFS的配置、部署与API使用解读(1)Get Started with FastDFS
- RHEL7: How to get started with Systemd.
- Java - Get Started with Trouble Shooting
- Get started with Docker 中文文档(1)——Part 1: Orientation and Setup
- get started with database rules
- FastDFS的配置、部署与API使用解读(1)Get Started with FastDFS