Skip to content
This repository has been archived by the owner on Nov 6, 2022. It is now read-only.
/ jquery.datahook Public archive

Syntactic sugar for jQuery selection using data-hook attributes.

License

Notifications You must be signed in to change notification settings

Falc/jquery.datahook

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

9 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

jquery.datahook

Syntactic sugar for jQuery selection using data-hook attributes.

Based on an article written by Will Boyd: Effective Event Binding with jQuery.

License: MIT

Requirements

Installation

Using bower:

bower install jquery --save
bower install jquery.datahook --save`

Usage

It extends jQuery adding the $.datahook() method.

$.datahook(hookName) selects elements through data-hook attributes:

  • $.datahook(): Selects all the hook elements.
  • $.datahook('*'): Same as $.datahook().
  • $.datahook('name'): Selects elements with a data-hook attribute containing name (a data-hook attribute can be a single name or a space-separated list of names).

Alternatively, it is possible to use the $.hook() alias.

If another hook-related jQuery plugin uses $.hook(), jquery.datahook will not register it as alias to prevent conflicts.

FAQ

Why using data-hook attributes instead of classes?

Short answer: Separation of concerns.

Long answer: The "select-by-class" approach is very common when using jQuery, but that leads to rely on a class for presentation and behaviour. It would be possible to rename or remove it due to some CSS refactoring and forget it was being used in Javascript too. Changes related to CSS should not affect to behaviour.

What about the speed? Class selector is faster than attribute selector!

"Attribute contains word" selector is relatively slower than "class" selector, as shown in this jsPerf benchmark, but it can perform thousands of operations per second. This is not a bottleneck.

The pros of separating the concerns are considerable (code is more maintainable and less error-prone) and the cons (slower selection) are unnoticeable.

About

Syntactic sugar for jQuery selection using data-hook attributes.

Resources

License

Stars

Watchers

Forks

Packages

No packages published