{"id":22325470,"url":"https://github.com/taeon/ninja","last_synced_at":"2026-05-01T01:31:49.730Z","repository":{"id":95760348,"uuid":"104491257","full_name":"Taeon/Ninja","owner":"Taeon","description":"NINJA Is Not a Jquery Alternative. Geddit? Except it is. Sort of.","archived":false,"fork":false,"pushed_at":"2020-11-05T09:01:39.000Z","size":43,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-03-26T05:44:34.019Z","etag":null,"topics":["javascript","jquery","queryselector","zepto"],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Taeon.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2017-09-22T15:40:12.000Z","updated_at":"2023-04-11T15:21:24.000Z","dependencies_parsed_at":null,"dependency_job_id":"f215c791-1f06-4e97-bd75-5a5a6e61d94a","html_url":"https://github.com/Taeon/Ninja","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/Taeon/Ninja","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Taeon%2FNinja","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Taeon%2FNinja/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Taeon%2FNinja/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Taeon%2FNinja/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Taeon","download_url":"https://codeload.github.com/Taeon/Ninja/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Taeon%2FNinja/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":32482460,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-04-30T13:12:12.517Z","status":"ssl_error","status_checked_at":"2026-04-30T13:12:06.837Z","response_time":57,"last_error":"SSL_read: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["javascript","jquery","queryselector","zepto"],"created_at":"2024-12-04T02:12:07.210Z","updated_at":"2026-05-01T01:31:49.710Z","avatar_url":"https://github.com/Taeon.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Ninja\r\n\r\n**N**INJA **I**s **N**ot a **J**query **A**lternative. Geddit? Except it is. Sort of.\r\n\r\n## What NINJA is\r\n\r\nNinja is intended to be a very small stand-in for jQuery, when all you need is some of what it can do -- like DOM manipulation or event handling. It's \u003c5.1KB minified, \u003c2.2KB GZipped (you do GZIP your pages, right?) -- small enough that you could embed it directly into the ```\u003cHEAD\u003e``` of your HTML without worrying about page bloat.\r\n\r\nI created it because I wanted to build JavaScript libraries that didn't require jQuery, but I often found myself frustrated at having to use JavaScript's verbose syntax. So I wanted to write\r\n\r\n```javascript\r\n$( '.button' ).on( 'click', function(){...} );\r\n```\r\n\r\n...but instead I had to write\r\n\r\n```javascript\r\ndocument.querySelector( '.button' ).addEventListener( 'click', function(){...} );\r\n```\r\n\r\nNot only is that very laborious, it's also very inefficient if you're doing it a lot. So I found myself creating a bunch of helper functions to save time...and then just thought \"why not collect them together in one place and make them work like jQuery?\".\r\n\r\n## What NINJA is **not**\r\n\r\nSo NINJA uses jQuery's syntax, but it provides only a very small subset of jQuery's functionality. It is not intended as a like-for-like replacement for jQuery, and it will never become that. If you're looking 'jQuery-but-smaller', try [Zepto](https://github.com/madrobby/zepto).\r\n\r\n## Making it even smaller\r\n\r\nTo further save bandwidth, you can just delete any methods you're not using. Watch our for dependencies though (e.g F() is used by a whole bunch of other methods). Obviously you'll need to minify the custom version of the code yourself.\r\n\r\n## When NINJA isn't enough...\r\n\r\nIf you start using NINJA and then later discover that for some reason you need some function from jQuery that NINJA doesn't provide, that's not a problem. Because the syntax is the same, you can just swap out NINJA, add jQuery and off you go -- no code changes required.\r\n\r\n## Supported syntax and methods\r\n\r\n### Selectors\r\n\r\nNINJA uses (more or less) the same selector syntax as jQuery, so pretty much anything you can do with a jQuery selector, you can do with NINJA. More specifically, it's relies on Javascript's native ```querySelectorAll()``` function -- note that  there are reportedly some inconsistencies between the two ([for example...](https://developer.rackspace.com/blog/using-querySelector-on-elements/)).\r\n\r\nI've also heard it said that there are differences between browser implementations (which jQuery fixes). I haven't yet come across any, however.\r\n\r\n### Functions\r\n\r\nAt the moment, NINJA supports the following functions:\r\n\r\n- Call a function on document ready\r\n\r\n```javascript\r\n$( function(){ alert( 'Hello world!' ); } );\r\n```\r\n\r\n- Create a DOM element:\r\n\r\n```javascript\r\nvar element = $( '\u003cdiv\u003eHello World!\u003c/div\u003e' );\r\n```\r\n\r\n- Append\r\n\r\n```javascript\r\n$( '#some-element' ).append( '#another-element' );\r\n```\r\n- Prepend\r\n\r\n```javascript\r\n$( '#some-element' ).prepend( '#another-element' );\r\n```\r\n- Insert before\r\n\r\n```javascript\r\n$( '#some-element' ).insertBefore( '#another-element' );\r\n```\r\n- Insert after\r\n\r\n```javascript\r\n$( '#some-element' ).insertAfter( '#another-element' );\r\n```\r\n\r\n- Find position in window (top, left)\r\n\r\n```javascript\r\nvar pos = $( '#some-element' ).offset();\r\n```\r\n\r\n- Remove\r\n\r\n```javascript\r\n$( '#some-element' ).remove();\r\n```\r\n\r\n- Find closest ancestor\r\n\r\n```javascript\r\nvar element = $( '#some-element' ).closest( '.another-class' );\r\n```\r\n\r\n- Add a class\r\n\r\n```javascript\r\n$( '.some-class' ).addClass( 'another-class' );\r\n```\r\n\r\n- Remove a class\r\n\r\n```javascript\r\n$( '.some-class' ).removeClass( 'another-class' );\r\n```\r\n\r\n- Has a class?\r\n\r\n```javascript\r\nif( $( '.some-class' ).hasClass( 'another-class' ) ){...}\r\n```\r\n\r\n- Each\r\n\r\n```javascript\r\n$( '#some-element' ).each( function(){...} );\r\n```\r\n\r\n- Add event listener\r\n\r\n```javascript\r\n$( '#some-element' ).on( 'click', function(){...} );\r\n```\r\n\r\n- Remove event listener\r\n\r\n```javascript\r\n$( '#some-element' ).off( 'click', function(){...} );\r\n```\r\n\r\n- Trigger event\r\n\r\n```javascript\r\n$( '#some-element' ).trigger( 'click', some_optional_data );\r\n```\r\n\r\n- Get index -- i.e. its numerical index as a child of its parent\r\n\r\n```javascript\r\nvar index = $( '#some-element' ).index();\r\n```\r\n\r\n- Get/set an element's data\r\n\r\n```javascript\r\n// Set (also works for multiple elements)\r\n$( '#some-element' ).data( 'foo', 'bar' );\r\n// Get a single value\r\nvar foo = $( '#some-element' ).data( 'foo' ); // 'bar'\r\n// Get all values (as an object)\r\n// Note that for maximum compatiblity, hyphenated values are returned in their original form and as camel-case\r\n// ...so for example, 'data-my-data-attribute' would be returned as 'my-data-attribute' and 'myDataAttribute'\r\nvar data = $( '#some-element' ).data(); // {foo:'bar'}\r\n```\r\n\r\n- Proxy\r\n\r\n```javascript\r\nvar func = $.proxy( function(){...}, this );\r\n```\r\n\r\n- Is array?\r\n\r\n```javascript\r\nif( $.isArray( myArray ) ){...}\r\n```\r\n\r\n- AJAX\r\n\r\nSend an AJAX request. This is a HIGHLY simplified version of the equivalent jQuery function.\r\n\r\n```javascript\r\nvar func = $.ajax( url, options );\r\n```\r\n\r\nCurrently the options (and their defaults) are as follows:\r\n\r\n```javascript\r\n{\r\n  method: 'get', // Request method e.g. get, post etc\r\n  data: null, // Any data to send with the (POST) request\r\n  success: function(){} // Callback on success. Arguments are JSON-decoded response text, status text, request object\r\n  error: function(){{ // Callback on failure. Arguments are request object, 'error', status text\r\n}\r\n```\r\n\r\n## Compatibility\r\n\r\nKnown to work with pretty much any recent browser (Chrome, Firefox, Safari, IE, Opera). Even IE9!\r\n\r\n## A note on performance\r\n\r\nNINJA was not written with performance in mind, and is likely to be significantly slower in heavy-use situations than jQuery, or vanilla JS. If you're planning to use it for resource-intensive applications, you might want to think again.\r\n\r\n## Acknowledgements\r\n\r\nThis library owes a massive debt to [You Might Not Need jQuery](http://youmightnotneedjquery.com/), so hats off to them. Also, inevitably, to an uncountable number of contributors to various threads on [StackOverflow](https://stackoverflow.com). You're all amazing.\r\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftaeon%2Fninja","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ftaeon%2Fninja","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftaeon%2Fninja/lists"}