技能 htmx-skill
📄

htmx-skill

低风险 🌐 网络访问📁 文件系统访问

Obtenir la documentation htmx

Besoin de documentation précise sur la syntaxe et le comportement de htmx. Cette compétence fournit une référence complète pour les attributs, événements, API, extensions et exemples htmx pour vous aider à créer des applications web modernes.

支持: Claude Codex Code(CC)
🥉 74 青铜
1

下载技能 ZIP

2

在 Claude 中上传

前往 设置 → 功能 → 技能 → 上传技能

3

开启并开始使用

测试它

正在使用“htmx-skill”。 Comment utiliser hx-get pour charger du contenu au clic ?

预期结果:

  • L'attribut hx-get émet une requête GET et insère la réponse dans le DOM.
  • Exemple : <button hx-get="/example" hx-target="#result">Charger</button>
  • Cela charge le contenu depuis /example et le place dans l'élément avec l'id 'result'.
  • Options courantes : hx-trigger (quel événement déclenche la requête), hx-swap (comment insérer le contenu), hx-indicator (afficher l'état de chargement).

正在使用“htmx-skill”。 Que fait hx-boost ?

预期结果:

  • L'attribut hx-boost convertit les ancres et les formulaires en requêtes AJAX.
  • Il maintient un repli gracieux pour les utilisateurs sans JavaScript activé.
  • Pour les formulaires, la cible est le body et l'échange innerHTML est utilisé par défaut.
  • Utilisez l'attribut hx-push-url si vous voulez que les URLs soient ajoutées à l'historique.

安全审计

低风险
v5 • 1/17/2026

This is a pure documentation/reference skill containing markdown files and a build script. The 2454 static findings are 99%+ false positives. The 'Ruby/shell backtick execution' findings are markdown code formatting. 'Weak cryptographic algorithm' findings are regex false positives from documentation text. Network/filesystem operations are for downloading documentation from GitHub. No malicious patterns detected.

87
已扫描文件
9,084
分析行数
2
发现项
5
审计总数

风险因素

🌐 网络访问 (2)
htmx_builder.py:127-135 htmx_builder.py:149-157
📁 文件系统访问 (2)
htmx_builder.py:248-253 htmx_builder.py:354-358
审计者: claude 查看审计历史 →

质量评分

64
架构
100
可维护性
85
内容
22
社区
90
安全
91
规范符合性

你能构建什么

Ajouter un comportement dynamique

Consulter les attributs htmx pour ajouter des fonctionnalités AJAX aux éléments HTML sans écrire de JavaScript.

Créer des interfaces réactives

Référencer les en-têtes de réponse pour implémenter des mises à jour pilotées par le serveur, des redirections et des déclencheurs d'événements.

Intégrer des extensions

Trouver la documentation pour les extensions SSE et WebSocket pour ajouter des fonctionnalités en temps réel à votre application.

试试这些提示

Syntaxe des attributs 
Comment utiliser hx-post pour soumettre un formulaire et insérer la réponse dans une div ?
Gestion des événements 
Quels événements se déclenchent pendant une requête htmx et quelles propriétés incluent-ils ?
En-têtes de réponse 
Comment utiliser HX-Location pour rediriger sans rechargement complet de la page ?
Utilisation des extensions 
Montrez-moi comment utiliser l'extension SSE pour mettre à jour le contenu à partir d'événements envoyés par le serveur.

最佳实践

  • Commencez par la page la plus spécifique pour votre question - privilégiez la documentation des attributs plutôt que les guides généraux.
  • Ouvrez le fichier référencé pour confirmer les détails avant l'implémentation, car les descriptions peuvent être brèves.
  • Consultez api.md pour les méthodes de l'API JavaScript lorsque vous avez besoin d'un contrôle programmatique sur htmx.

避免

  • N'utilisez pas htmx pour la gestion d'état complexe côté client - il est conçu pour les interfaces pilotées par le serveur.
  • N'oubliez pas de gérer les erreurs de validation - utilisez hx-validate avec l'API de validation HTML5.
  • Ne négligez pas les options de timing de hx-swap - des paramètres d'échange inappropriés peuvent causer du scintillement ou une perte de focus.

常见问题

Avec quoi htmx est-il compatible ?
htmx fonctionne avec n'importe quel framework côté serveur et ne nécessite aucun outil de build. Il se dégrade gracieusement lorsque JavaScript est désactivé.
Quelles sont les limites des requêtes htmx ?
htmx effectue des requêtes HTTP standard. Les limites dépendent de la configuration de votre serveur et des paramètres réseau.
htmx peut-il s'intégrer avec d'autres bibliothèques ?
Oui, htmx possède des extensions pour de nombreux cas d'usage et peut fonctionner aux côtés de React, Vue ou d'autres frameworks pour des composants spécifiques.
Les données sont-elles sécurisées avec htmx ?
htmx utilise les fonctionnalités de sécurité standard du navigateur. Les données sensibles ne doivent pas être stockées dans le HTML côté client sans protection.
Pourquoi ma requête htmx ne fonctionne-t-elle pas ?
Vérifiez la console du navigateur pour les erreurs, vérifiez que l'URL renvoie du HTML valide, et assurez-vous que hx-target sélectionne le bon élément.
Comment htmx se compare-t-il à l'API fetch ?
htmx fournit de l'AJAX déclaratif via des attributs HTML. L'API fetch nécessite du code JavaScript. Utilisez htmx pour les interfaces pilotées par le serveur et fetch pour la logique client complexe.

开发者详情

作者

DrZoot

许可证

Apache-2.0

仓库

https://github.com/DrZoot/htmx-skill/tree/main/

引用

main

文件结构

📁 references/

📁 attributes/

📄 hx-boost.md

📄 hx-confirm.md

📄 hx-delete.md

📄 hx-disable.md

📄 hx-disabled-elt.md

📄 hx-disinherit.md

📄 hx-encoding.md

📄 hx-ext.md

📄 hx-get.md

📄 hx-headers.md

📄 hx-history-elt.md

📄 hx-history.md

📄 hx-include.md

📄 hx-indicator.md

📄 hx-inherit.md

📄 hx-on.md

📄 hx-params.md

📄 hx-patch.md

📄 hx-post.md

📄 hx-preserve.md

📄 hx-prompt.md

📄 hx-push-url.md

📄 hx-put.md

📄 hx-replace-url.md

📄 hx-request.md

📄 hx-select-oob.md

📄 hx-select.md

📄 hx-swap-oob.md

📄 hx-swap.md

📄 hx-sync.md

📄 hx-target.md

📄 hx-trigger.md

📄 hx-validate.md

📄 hx-vals.md

📄 hx-vars.md

📁 examples/

📁 move-before/

📄 details.md

📄 active-search.md

📄 animations.md

📄 async-auth.md

📄 bulk-update.md

📄 click-to-edit.md

📄 click-to-load.md

📄 confirm.md

📄 delete-row.md

📄 dialogs.md

📄 edit-row.md

📄 file-upload-input.md

📄 file-upload.md

📄 infinite-scroll.md

📄 inline-validation.md

📄 keyboard-shortcuts.md

📄 lazy-load.md

📄 modal-bootstrap.md

📄 modal-custom.md

📄 modal-uikit.md

📄 progress-bar.md

📄 reset-user-input.md

📄 sortable.md

📄 tabs-hateoas.md

📄 tabs-javascript.md

📄 update-other-content.md

📄 value-select.md

📄 web-components.md

📁 extensions/

📄 building.md

📄 head-support.md

📄 htmx-1-compat.md

📄 idiomorph.md

📄 preload.md

📄 response-targets.md

📄 sse.md

📄 ws.md

📁 headers/

📄 hx-location.md

📄 hx-push-url.md

📄 hx-push.md

📄 hx-redirect.md

📄 hx-replace-url.md

📄 hx-trigger.md

📄 api.md

📄 events.md

📄 _post_SKILL.md

📄 _pre_SKILL.md

📄 config.yaml

📄 htmx_builder.py

📄 LICENSE

📄 README.md

📄 SKILL.md