112 lines
2.1 KiB
Markdown
112 lines
2.1 KiB
Markdown
# [ajquery.js](https://git.coolaj86.com/coolaj86/ajquery.js)
|
|
|
|
The fastest, most lightweight, fewest dependency jQuery alternative.
|
|
|
|
Development Build: 572B (types + comments) \
|
|
Production Build: 117B (min + gz)
|
|
|
|
## Example Usage
|
|
|
|
Provides modern, advanced CSS4-compatible query selection:
|
|
|
|
```js
|
|
console.log("innerText:", $("p:nth-child(2").innerText);
|
|
```
|
|
|
|
## Install
|
|
|
|
### via GitHub
|
|
|
|
```bash
|
|
my_ver="v3.0.0"
|
|
|
|
mkdir ./vendor/
|
|
|
|
curl -fsSL "https://raw.githubusercontent.com/coolaj86/ajquery.js/${my_ver}/ajquery.js" \
|
|
-o ./vendor/ajquery.js
|
|
|
|
# Lighthouse-optimized
|
|
npx -p uglify-js@3 uglifyjs ./vendor/ajquery.js -o ./vendor/ajquery.min.js
|
|
```
|
|
|
|
```html
|
|
<script src="/vendor/ajquery.js"></script>
|
|
```
|
|
|
|
### via CDN
|
|
|
|
```html
|
|
<script src="https://unpkg.com/ajquery@3.0.0/ajquery.min.js"></script>
|
|
```
|
|
|
|
Bundler-optimized:
|
|
|
|
```html
|
|
<script src="https://unpkg.com/ajquery@3.0.0/ajquery.min.cjs"></script>
|
|
```
|
|
|
|
Tree-shaking-optimized:
|
|
|
|
```html
|
|
<script src="https://unpkg.com/ajquery@3.0.0/ajquery.min.mjs"></script>
|
|
```
|
|
|
|
### via NPM
|
|
|
|
```sh
|
|
npm install --save ajquery@3
|
|
```
|
|
|
|
#### CommonJS
|
|
|
|
```js
|
|
let AJQuery = require("ajquery");
|
|
let $ = AJQuery.$;
|
|
let $$ = AJQuery.$$;
|
|
```
|
|
|
|
#### ESM
|
|
|
|
```js
|
|
import AJQuery from "ajquery";
|
|
let $ = AJQuery.$;
|
|
let $$ = AJQuery.$$;
|
|
```
|
|
|
|
## API
|
|
|
|
### `$(selector, [rootElement])`
|
|
|
|
Selects the first matching HTML element only (or `null`):
|
|
|
|
```js
|
|
const body = $("body");
|
|
const div1 = $("div", body);
|
|
```
|
|
|
|
### `$$(selector, [rootElement])`
|
|
|
|
Selects all matching elements (or an empty `NodeList`):
|
|
|
|
```js
|
|
const head = $("head");
|
|
const stylesheets = $$('link[rel="stylesheet"]', head).map(console.log);
|
|
```
|
|
|
|
## Benchmarks
|
|
|
|
|
|
|
|
## Compatibility
|
|
|
|
Written entirely in modern ECMAScript 3, and directly transpilable into ES5, ES6
|
|
and beyond (up to ES11) via Webpack, Babel, Rollup, React Native, and AWS
|
|
InfiniDash.
|
|
|
|
Works in [all browsers](https://caniuse.com/?search=queryselector) in living
|
|
memory.
|
|
|
|
See the full
|
|
[Browser Compatibility Matrix](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement#browser_compatibility)
|
|
on MDN.
|