Script này sẽ không được không được cài đặt trực tiếp. Nó là một thư viện cho các script khác để bao gồm các chỉ thị meta
// @require https://update.greasyfork.org/scripts/480/1446/onjs.js
The fun part of user scripting
is deciding what happens.
The boring part
is scavenging the DOM
for bits of templated data,
or elements you want to mod.
Have on.js
do it for you!
MIT licensed, or
Copyheart:
copying is an act of love.
Please copy and share!
Quick Example
Want to sift away noise at retailmenot?
// hide the noise at http://www.retailmenot.com/view/vayama.com
on({ dom: [ 'css* #offers li.offer'
, { deal: 'xpath .'
, coupon: 'css? .crux .code'
}
]
, ready: nukeCouponless
});
function nukeCouponless(offers) {
offers.forEach(function sift(a) {
if (!a.coupon)
a.deal.style.display = 'none';
});
}
What's the benefit?
Separate logic from page structure.
I could talk all night
about what this buys you
– here are some highlights:
Beautiful code
Optimize for happiness!
This is of course personal,
but I love how clean on.js
makes my user scripts.
I can see what they do,
at a moment's glance, and
what data they depend on.
Maintenance gets easier.
Sane native javascript types
The DOM API:s are not only verbose,
but also cripple results with bad types!
From on.js
array selectors, you get a
real Array
that you can operate on with
.forEach
, .map
, .some
, .every
,
.filter
, .reduce
, .slice
, .indexOf
,
and all the other really awesome
Array.prototype
methods.
More complex scripts become feasible
As a script's complexity grows,
so does the burden of maintaining it.
With on.js
, this is still true
– but it grows far slower!
Seeing (and naming) the structure
of the input your code operates on
helps reading and writing the code
operating on it.
Reuse one script's page structure awareness
Maybe you later want to whip up
another script using the same data,
or even make a shell web scraper for it?
Copy, paste, done!
You're in business – in seconds.
Have your scripts magically self-deprecate
Web sites change.
This makes user scripts break,
start doing the wrong thing, or
filling your console with errors.
When they change
so your script
no longer has the stuff it needs,
your code will just never run
instead of breaking the page.
If you don't miss it, great!
– that site has improved, and
your script will never bother it.
If you do – just update
its on.js
preamble,
and your code just
magically works again.
Tests
on.js
comes with a test suite.
It uses node.js,
test'em and
coffee-script.
Once node is installed,
run this to install the latter two:
npm install testem coffee-script -g
Then you can run it like this, for instance:
testem -l chrome
Incidentally, it provides pretty good docs
about all the ways you can slice a page,
and and how they work.
New tests are easy to add.
Just stick them in the appropriate
.coffee
file in tests/
,
or make a new .js
or .coffee
file
in the same directory, and
test'em will pick it up, too.
They are currently written in
jasmine,
lightly tweaked for improved readability.