{"id":51197038,"url":"https://github.com/jqueryscript/jquery-cheatsheet","last_synced_at":"2026-06-27T21:31:04.407Z","repository":{"id":359502589,"uuid":"1246351550","full_name":"jqueryscript/jquery-cheatsheet","owner":"jqueryscript","description":"A  jQuery 4 cheat sheet with classic APIs, migration notes, and removed API replacements.","archived":false,"fork":false,"pushed_at":"2026-05-22T06:06:30.000Z","size":31,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2026-05-22T14:48:03.276Z","etag":null,"topics":["cheatsheet","jquery","jquery-4","jquery4"],"latest_commit_sha":null,"homepage":"https://www.jqueryscript.net/jquery-cheat-sheet/","language":"CSS","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/jqueryscript.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","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,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2026-05-22T05:43:03.000Z","updated_at":"2026-05-22T06:06:34.000Z","dependencies_parsed_at":null,"dependency_job_id":null,"html_url":"https://github.com/jqueryscript/jquery-cheatsheet","commit_stats":null,"previous_names":["jqueryscript/jquery-cheatsheet"],"tags_count":null,"template":false,"template_full_name":null,"purl":"pkg:github/jqueryscript/jquery-cheatsheet","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jqueryscript%2Fjquery-cheatsheet","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jqueryscript%2Fjquery-cheatsheet/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jqueryscript%2Fjquery-cheatsheet/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jqueryscript%2Fjquery-cheatsheet/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/jqueryscript","download_url":"https://codeload.github.com/jqueryscript/jquery-cheatsheet/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jqueryscript%2Fjquery-cheatsheet/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":34869004,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-26T15:22:16.424Z","status":"online","status_checked_at":"2026-06-27T02:00:06.362Z","response_time":126,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"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":["cheatsheet","jquery","jquery-4","jquery4"],"created_at":"2026-06-27T21:31:03.782Z","updated_at":"2026-06-27T21:31:04.402Z","avatar_url":"https://github.com/jqueryscript.png","language":"CSS","funding_links":[],"categories":[],"sub_categories":[],"readme":"﻿# jQuery 4 Cheat Sheet\n\nFast jQuery lookup for real projects. This repo collects the jQuery 4 APIs developers reach for most often, plus the older jQuery patterns that still work in jQuery 4 and the removed APIs that need native JavaScript replacements.\n\nUse it when you need to maintain legacy jQuery code, update a jQuery 3 project, check a method signature, copy a short example, or confirm whether an old snippet still belongs in a jQuery 4 codebase.\n\nWeb version: [jQuery Cheat Sheet](https://www.jqueryscript.net/jquery-cheat-sheet/)\n\n## What Is Included\n\n- 63 beginner-friendly examples across 13 sections.\n- jQuery 4 install and loading examples.\n- Selectors, traversal, DOM manipulation, attributes, properties, data, CSS, dimensions, events, effects, Ajax, and utilities.\n- Classic jQuery APIs that remain useful in jQuery 4, including `.val()`, `.serialize()`, `.one()`, `.trigger()`, `.eq()`, and `.hasClass()`.\n- jQuery 4 migration notes for slim builds, Ajax behavior, CSS units, browser support, jQuery UI, and Node-like environments.\n- Removed APIs with modern replacements.\n- Short examples designed for quick copying and comparison.\n\n## Live Page Target\n\nPublic URL: [https://www.jqueryscript.net/jquery-cheat-sheet/](https://www.jqueryscript.net/jquery-cheat-sheet/)\n\n## Quick Start\n\nClone or download the repo, then run:\n\n```bash\nnpm run validate\nnpm run serve\n```\n\nOpen:\n\n```text\nhttp://localhost:4173\n```\n\nThe project has no frontend build step. It is plain HTML, CSS, JavaScript, SVG, and JSON.\n\n## jQuery 4 Install Examples\n\nOfficial CDN:\n\n```html\n\u003cscript src=\"https://code.jquery.com/jquery-4.0.0.min.js\"\u003e\u003c/script\u003e\n\u003cscript\u003e\n  $(function () {\n    $(\".status\").text(\"jQuery is ready\");\n  });\n\u003c/script\u003e\n```\n\nnpm:\n\n```bash\nnpm install jquery@4.0.0\n```\n\nBundler import:\n\n```js\nimport $ from \"jquery\";\n\n$(\".notice\").addClass(\"is-visible\");\n```\n\nSlim build:\n\n```html\n\u003cscript src=\"https://code.jquery.com/jquery-4.0.0.slim.min.js\"\u003e\u003c/script\u003e\n```\n\nUse the full build when you need Ajax, effects, Deferred, Callbacks, or queues.\n\n## Cheat Sheet Sections\n\n| Section | Covers |\n| --- | --- |\n| Getting Started | CDN, npm, ready handlers, slim build, browser support |\n| Classic APIs Still Useful in jQuery 4 | `.val()`, `.serialize()`, `.one()`, `.trigger()`, `.eq()`, `.hasClass()`, chaining |\n| Selectors | CSS selectors, context selection, `.filter()`, `.find()` |\n| DOM Traversal | `.closest()`, `.children()`, `.siblings()` |\n| DOM Manipulation | `.text()`, `.html()`, `.append()`, `.prepend()`, `.remove()`, `.empty()` |\n| Attributes, Properties, Data | `.attr()`, `.prop()`, `.data()`, class helpers |\n| CSS and Dimensions | `.css()`, `.width()`, `.height()`, `.offset()`, `.position()` |\n| Events | `.on()`, delegated events, `.off()`, focus event notes |\n| Effects | `.show()`, `.hide()`, `.fadeIn()`, `.fadeOut()`, `.animate()` |\n| Ajax | `$.ajax()`, `$.getJSON()`, `$.post()`, JSONP, script requests |\n| Utilities and Miscellaneous | `.each()`, `.map()`, `$.extend()`, `$.uniqueSort()` |\n| jQuery 4 Notes | Migrate, jQuery UI compatibility, factory entry point, Trusted Types |\n| Removed APIs and Replacements | Removed helper APIs and native replacements |\n\n## Common jQuery 4 Examples\n\nRun code after the DOM is ready:\n\n```js\n$(function () {\n  $(\".menu\").addClass(\"is-ready\");\n});\n```\n\nSelect elements:\n\n```js\n$(\"#main\");\n$(\".button\");\n$(\"nav a\");\n$(\"input[type='email']\");\n```\n\nFind elements inside a container:\n\n```js\n$(\".card\")\n  .find(\"button\")\n  .prop(\"disabled\", false);\n```\n\nUse event delegation:\n\n```js\n$(\".todo-list\").on(\"click\", \".remove\", function () {\n  $(this).closest(\"li\").remove();\n});\n```\n\nRead and set form values:\n\n```js\nconst email = $(\"#email\").val();\n$(\"#email\").val(\"editor@example.com\");\n```\n\nSerialize a form:\n\n```js\nconst payload = $(\"#contact-form\").serialize();\n$.post(\"/api/contact\", payload);\n```\n\nMake an Ajax request:\n\n```js\n$.ajax({\n  url: \"/api/profile\",\n  method: \"GET\",\n  dataType: \"json\"\n}).done(function (profile) {\n  $(\".name\").text(profile.name);\n}).fail(function () {\n  $(\".error\").text(\"Could not load profile\");\n});\n```\n\nAnimate with explicit units:\n\n```js\n$(\".progress-bar\").animate({\n  width: \"75%\"\n}, 300);\n```\n\n## Classic APIs Still Useful in jQuery 4\n\nMany jQuery snippets written before jQuery 4 still use APIs that remain valid. This cheat sheet includes those APIs because they are common in production code and still useful for beginners.\n\nExamples:\n\n```js\n$(\".notice\")\n  .addClass(\"is-visible\")\n  .text(\"Saved\")\n  .attr(\"role\", \"status\");\n```\n\n```js\n$(\".intro-video\").one(\"play\", function () {\n  $(\".video-note\").text(\"Started\");\n});\n```\n\n```js\n$(\"#country\").val(\"US\").trigger(\"change\");\n```\n\n```js\n$(\".gallery img\").eq(2).addClass(\"is-featured\");\n$(\".steps li\").first().addClass(\"is-current\");\n$(\".steps li\").last().addClass(\"is-final\");\n```\n\n## Important jQuery 4 Notes\n\n- jQuery 4.0.0 is available from the official CDN and npm.\n- The slim build excludes Ajax, effects, callbacks, deferred, and queue modules.\n- IE 10 and older are no longer supported.\n- Edge Legacy and older mobile browser versions are no longer supported.\n- jQuery UI should be 1.13.3 or newer.\n- `toggleClass(Boolean | undefined)` was removed.\n- JSONP requests must use `dataType: \"jsonp\"` explicitly.\n- Ajax script execution must use `dataType: \"script\"` or `$.getScript()`.\n- Most CSS values that need units should be written with explicit units.\n- In Node-like environments without a DOM window, use `require(\"jquery/factory\")(window)`.\n\n## Removed APIs and Replacements\n\n| Removed API | Replacement |\n| --- | --- |\n| `$.trim(value)` | `String(value).trim()` or `value.trim()` |\n| `$.parseJSON(text)` | `JSON.parse(text)` |\n| `$.isArray(value)` | `Array.isArray(value)` |\n| `$.isFunction(value)` | `typeof value === \"function\"` |\n| `$.isNumeric(value)` | `Number.isFinite(Number(value))` or a project-specific check |\n| `$.isWindow(value)` | Avoid when possible. If required, use `obj != null \u0026\u0026 obj === obj.window`. |\n| `$.now()` | `Date.now()` |\n| `$.type(value)` | `typeof`, `Array.isArray`, `instanceof`, or `Object.prototype.toString.call(value)` |\n| `$.unique(array)` | `$.uniqueSort(array)` |\n| `$.nodeName(element, name)` | `element.nodeName.toLowerCase()` |\n\n## Project Structure\n\n```text\n.\n|-- index.html\n|-- assets/\n|   |-- app.js\n|   |-- styles.css\n|   |-- favicon.svg\n|   `-- jquery-4-cheat-sheet-og.svg\n|-- data/\n|   `-- jquery-4-cheatsheet.json\n|-- scripts/\n|   `-- validate-data.js\n|-- .github/\n|   |-- ISSUE_TEMPLATE/\n|   `-- workflows/\n|-- CONTRIBUTING.md\n|-- LICENSE\n|-- package.json\n`-- README.md\n```\n\n## Content Data Model\n\nAll cheat sheet entries live in `data/jquery-4-cheatsheet.json`.\n\nEach item uses this shape:\n\n```json\n{\n  \"id\": \"classic-val\",\n  \"title\": \"Read or set form values\",\n  \"syntax\": \".val([value])\",\n  \"example\": \"const email = $(\\\"#email\\\").val();\\n$(\\\"#email\\\").val(\\\"editor@example.com\\\");\",\n  \"notes\": \".val() is still one of the most common jQuery form helpers.\",\n  \"jquery4Status\": \"current\",\n  \"replacement\": \"\",\n  \"officialUrl\": \"https://api.jquery.com/val/\"\n}\n```\n\nAllowed `jquery4Status` values:\n\n- `current`\n- `changed`\n- `removed`\n- `caution`\n\n## Validation\n\nRun:\n\n```bash\nnpm run validate\n```\n\nThe validator checks:\n\n- valid JSON\n- required root fields\n- required section fields\n- required item fields\n- duplicate IDs\n- valid `jquery4Status` values\n- official jQuery URLs\n- replacements for removed APIs\n- removed jQuery APIs accidentally used inside examples\n\n## Local Development\n\nStart a local static server:\n\n```bash\nnpm run serve\n```\n\nOpen:\n\n```text\nhttp://localhost:4173\n```\n\nNo dependencies need to be installed for normal development. Node is used only for validation.\n\n## SEO Notes\n\nThe `index.html` page includes:\n\n- one H1\n- concise title and meta description\n- canonical URL\n- Open Graph tags\n- Twitter Card tags\n- JSON-LD `BreadcrumbList`\n- JSON-LD `TechArticle`\n- JSON-LD `ItemList`\n- crawlable intro copy\n- stable section anchors\n\nRecommended target keyword:\n\n```text\njQuery 4 Cheat Sheet\n```\n\nSecondary topics:\n\n- jQuery 4 selectors\n- jQuery 4 events\n- jQuery 4 Ajax\n- jQuery 4 removed APIs\n- jQuery 4 migration\n- jQuery cheat sheet\n\n## GitHub Repository Setup\n\nSuggested repository values:\n\n| Field | Value |\n| --- | --- |\n| Repository name | `jquery-4-cheatsheet` |\n| Package name | `jquery-4-cheatsheet` |\n| Display name | `jQuery 4 Cheat Sheet` |\n| Short description | `A searchable jQuery 4 cheat sheet with classic APIs, migration notes, and removed API replacements.` |\n| Homepage URL | `https://www.jqueryscript.net/jquery-cheat-sheet/` |\n| Visibility | Public |\n| License | MIT |\n| Default branch | `main` |\n| Pages source | Not required if hosted on jqueryscript.net |\n\nSuggested GitHub topics:\n\n```text\njquery\njquery-4\ncheatsheet\njavascript\nweb-development\nfrontend\najax\ndom\nevents\nmigration-guide\njqueryscript\n```\n\nSuggested social preview title:\n\n```text\njQuery 4 Cheat Sheet\n```\n\nSuggested social preview description:\n\n```text\nSearch and copy jQuery 4 examples for selectors, events, Ajax, effects, classic APIs, migration notes, and removed API replacements.\n```\n\n## package.json Metadata\n\n```json\n{\n  \"name\": \"jquery-4-cheatsheet\",\n  \"version\": \"1.0.0\",\n  \"description\": \"Searchable jQuery 4 cheat sheet with classic APIs, migration notes, and removed API replacements.\",\n  \"private\": true,\n  \"scripts\": {\n    \"validate\": \"node scripts/validate-data.js\",\n    \"serve\": \"python -m http.server 4173\"\n  },\n  \"keywords\": [\n    \"jquery\",\n    \"jquery-4\",\n    \"jquery-cheatsheet\",\n    \"cheatsheet\",\n    \"javascript\",\n    \"frontend\",\n    \"dom\",\n    \"ajax\",\n    \"events\",\n    \"migration-guide\"\n  ],\n  \"license\": \"MIT\"\n}\n```\n\n## Publishing Checklist\n\n- Update the final canonical URL in `index.html`.\n- Upload `index.html`, `assets/`, and `data/` to the target site path.\n- Keep `data/jquery-4-cheatsheet.json` next to the page at the expected relative path.\n- Confirm `assets/app.js` can fetch `data/jquery-4-cheatsheet.json`.\n- Test search, filters, copy buttons, dark mode, and mobile layout.\n- Run `npm run validate` before publishing.\n- Check external links open in a new tab.\n\n## Sources\n\n- [jQuery 4.0.0 release post](https://blog.jquery.com/2026/01/17/jquery-4-0-0/)\n- [jQuery Core 4.0 Upgrade Guide](https://jquery.com/upgrade-guide/4.0/)\n- [jQuery API Documentation](https://api.jquery.com/)\n\n## Contributing\n\nContent corrections are welcome. Please keep examples short, beginner-friendly, and verified against official jQuery documentation.\n\nBefore opening a pull request:\n\n```bash\nnpm run validate\n```\n\n## License\n\nMIT\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjqueryscript%2Fjquery-cheatsheet","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fjqueryscript%2Fjquery-cheatsheet","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjqueryscript%2Fjquery-cheatsheet/lists"}