# blyde > A blade-sharp javascript library that provides serval simple jQuery like operations Latest version **0.1.0-beta.1** (published 2016-12-28) · MIT license · 0 weekly downloads ## Install ```sh npm install blyde pnpm add blyde yarn add blyde bun add blyde ``` ## Health **Score 15/100 (F)** — status: abandoned. Positive: no vulnerabilities. Warnings: low downloads; no types; no esm support; pre 1.0. Negative: abandoned; low maintenance score. ## Facts | | | |---|---| | Version | 0.1.0-beta.1 | | Published | 2016-12-28 | | First published | 2016-06-09 | | Weekly downloads | 0 | | License | MIT | | TypeScript types | none | | Module format | CommonJS | | Dependencies | 0 | | Known vulnerabilities | 0 | | Install scripts | no | | Author | ClassicOldSong | | Maintainers | classicoldsong | | Keywords | Blyde, Javascript, jQuery, Dom | ## Links - npm: https://www.npmjs.com/package/blyde - Repository: https://github.com/ClassicOldSong/Blyde - Homepage: https://github.com/ClassicOldSong/Blyde#readme - Issues: https://github.com/ClassicOldSong/Blyde/issues - npm.io page: https://npm.io/package/blyde ## Alternatives - [babylon](https://npm.io/package/babylon.md) — 5.1M weekly downloads - [csscolorparser](https://npm.io/package/csscolorparser.md) — 3.7M weekly downloads - [expr-eval-fork](https://npm.io/package/expr-eval-fork.md) — 1.5M weekly downloads - [@leeoniya/ufuzzy](https://npm.io/package/@leeoniya/ufuzzy.md) — 247.7K weekly downloads - [xml-parser](https://npm.io/package/xml-parser.md) — 78.4K weekly downloads ## Recent versions - 0.1.0-beta.1 (latest) — 2016-12-28 - 0.1.0-alpha.21 — 2016-12-26 - 0.1.0-alpha.20 — 2016-12-22 - 0.1.0-alpha.19 — 2016-12-17 - 0.1.0-alpha.18 — 2016-12-07 - 0.1.0-alpha.16 — 2016-11-21 - 0.1.0-alpha.14 — 2016-11-20 - 0.1.0-alpha.13 — 2016-11-19 - 0.1.0-alpha.12 — 2016-11-17 - 0.1.0-alpha.11 — 2016-11-11 - 0.1.0-alpha.10 — 2016-11-11 - 0.1.0-alpha.9 — 2016-11-11 - 0.1.0-alpha.8 — 2016-11-11 - 0.1.0-alpha.7 — 2016-11-11 - 0.1.0-alpha.6 — 2016-11-11 - … 9 more at https://npm.io/package/blyde/versions ## README # Blyde [![GitHub license](https://img.shields.io/badge/license-MIT-blue.svg?style=flat-square)](https://raw.githubusercontent.com/ClassicOldSong/Blyde/master/LICENSE) [![npm](https://img.shields.io/npm/dt/blyde.svg?style=flat-square)](https://www.npmjs.com/package/blyde) [![Build status](https://img.shields.io/travis/ClassicOldSong/Blyde.svg?style=flat-square)](https://travis-ci.org/ClassicOldSong/Blyde) A blade-sharp javascript library that provides serval simple jQuery like operations ## Basic Usage + `node.$`: Wrap the node with Blyde, return a `$node` + `node.$id`: The special id for this node if wrapped by Blyde already (DO NOT MODIFY!!) + `Blyde(function)`: Execute the function when document is ready + `Blyde.version`: Version of Blyde + `Blyde.fn(plugin)`: Register a plugin for Blyde (See Wiki for Plugin usage \**Not Completed*\*) + `Blyde.useVelocity(Velocity)`: Add Velocity manually if Velocity is not attached to `window` + `$(function)`: Same as `Blyde()` + `$.version`: Same as `Blyde.version` + `$.fn(plugin)`: Same as `Blyde.fn()` + `$.q('selector')`: Wrapper for `document.querySelector()` and return a `$node` + `$.qa('selector')`: Wrapper for `document.querySelectorAll()` and return a `$nodeList` + `$.on(type, listener[, useCapture])`: Wrapper for `window.addEventListener()` + `$.listen(type, node, fn)`: Create a delegate for a node on `window` + `$.at(type, fn)`: Create a delegate for window on `window` + `$.drop(type, node, fn)`: Remove a delegate for a node on `window` + `$.off(type, fn[, useCapture])`: Remove enentListeners for this element with `window.removeEventListener()` & `window.drop()` + `$.$getSymbol()`: Get a `Symbol` with a random string + `$node.$el`: The original node of this element + `$node.q('selector')`: Wrapper for `node.querySelector()` and return a `$node` + `$node.qa('selector')`: Wrapper for `node.querySelectorAll()` and return a `$nodeList` + `$node.addClass('classe names')`: Add classes to this element, use `space` for multiple class names + `$node.removeClass('class names')`: Remove classes from this element, use `space` for multiple class names + `$node.toggleClass('class names')`: Toggle classes for this element, use `space` for multiple class names + `$node.replaceWith(node)`: Replace this element with a new element + `$node.swap(node)`: Swap this element with another + `$node.before(node)`: Insert this element before an element + `$node.after(node)`: Insert this element after an element + `$node.append(nodes)`: Append elements to this element + `$node.prepend(nodes)`: Prepend elements to this element + `$node.appendTo(node)`: Append this element to an element + `$node.prependTo(node)`: Prepend this element to an element + `$node.empty()`: Delete all childnodes from this element + `$node.remove()`: Delete this element from document and return this element itself *(Not a `$node`!!)* + `$node.safeRemove()`: Remove this element from document while all event listeners are still maintained + `$node.on(type, fn[, useCapture])`: Wrapper for `Node.addEventListener()` + `$node.listen(type, node, fn)`: Create a delegate for a node on this element + `$node.at(type, fn)`: Create a delegate for this element on `window` + `$node.drop(type, node, fn)`: Remove a delegate for a node on this element + `$node.off(type, fn[, useCapture])`: Remove enentListeners for this element with `Node.removeEventListener()` & `$.drop()` + `$nodeList.addClass('classe names')`: Add classes to all elements in this nodelist, use `space` for multiple class names + `$nodeList.removeClass('class names')`: Remove classes from all elements in this nodelist, use `space` for multiple class names + `$nodeList.toggleClass('class names')`: Toggle classes for all elements in this nodelist, use `space` for multiple class names + `$nodeList.appendTo(node)`: Append all elements in this nodelist to this element + `$nodeList.prependTo(node)`: Prepend all elements in this nodelist to this element + `$nodeList.empty()`: Delete all childnodes from elements in this nodelist + `$nodeList.remove()`: Delete all elements in this nodelist from document + `$nodeList.safeRemove()`: Remove all elements in this nodelist from document while all event listeners are still maintained + `$nodeList.on(type, fn[, useCapture])`: Add event listener to all elements in this nodelist + `$nodeList.at(type, fn)`: Create delegate to all elements in this nodelist on `window` + `$nodeList.off(type, fn[, useCapture])`: Remove event listener for all elements in this nodelist ## Animation To use animation, simply add [Velocity.js](http://julian.com/research/velocity/) into your HTML before document is ready: ``` javascript ``` or ``` javascript import Blyde from 'blyde' import Velocity from 'velocity-animate' Blyde.useVelocity(Velocity) ``` Then you can use: + `$node.velocity(arguments)`: Animate this element + `$nodeList.velocity(arguments)`: Animate all elements in this nodelist Detial usage please read the instruction of [Velocity.js](http://velocityjs.org/) The usage of Velocity.js with Blyde should be similar to that with jQuery. ## Compatibility Currently only supports IE10+, if you would like to use Blyde in IE9+, simply add [classlist-polyfill](https://www.npmjs.com/package/classlist-polyfill) into your project. ## Build from source ``` $ git clone https://github.com/ClassicOldSong/Blyde.git $ cd Blyde $ npm install $ npm run build ``` Then you can get the fresh-built `blyde.min.js` at the `dist` folder **Note:** All debugging messages are disabled in the production version ## License [MIT](http://cos.mit-license.org/) --- _Source: https://npm.io/package/blyde · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._