34 lines
2.9 KiB
Markdown
34 lines
2.9 KiB
Markdown
|
---
|
||
|
|
title: Web Components
|
||
|
|
localeTitle: مكونات الويب
|
||
|
|
---
|
||
|
|
## ما هي مكونات الويب؟
|
||
|
|
|
||
|
|
تتكون مكونات الويب من سلسلة من مواصفات الويب التي تم إنشاؤها بواسطة [W3C](https://w3c.github.io/) . تصف هذه المواصفات مجموعة من واجهات برمجة تطبيقات منصة الويب التي يمكن استخدامها لإنشاء عناصر HTML قابلة لإعادة الاستخدام ومغلفة وقابلة للتخصيص. من خلال عرض واجهات برمجة تطبيقات الويب منخفضة المستوى التي يستخدمها مورّدو المستعرض لإنشاء عناصر HTML التي قد تكون معتادًا عليها مسبقًا ، يمكن استخدام مكونات الويب عبر مجموعة متنوعة من البيئات. هذا يعني ما إذا كنت تعمل على موقع Wordpress ، أو تطبيق مقدم للخادم ، أو تطبيق صفحة واحدة (SPA) بأحدث إطار ، أو بدون إطار إطلاقاً ، يمكن استخدام مكونات الويب. لأول مرة ، وبغض النظر عن إطار العمل المستخدم ، يمكنك فهم الويب كمنصة لإيجاد تجارب فريدة يسهل التعامل معها مترجمة من منصة واحدة إلى أخرى.
|
||
|
|
|
||
|
|
## مواصفات مكون الويب
|
||
|
|
|
||
|
|
يتم تعريف مكونات الويب في [أربعة مواصفات رئيسية](https://www.webcomponents.org/introduction#specifications) .
|
||
|
|
|
||
|
|
* **عناصر مخصصة**
|
||
|
|
|
||
|
|
* تضع [مواصفات العناصر المخصصة](https://w3c.github.io/webcomponents/spec/custom/) الأساس لتصميم واستخدام أنواع جديدة من عناصر DOM.
|
||
|
|
|
||
|
|
* **الظل DOM**
|
||
|
|
|
||
|
|
* تحدد [مواصفات Shadow DOM](https://w3c.github.io/webcomponents/spec/shadow/) كيفية استخدام النمط المغلف والعلامات في مكونات الويب.
|
||
|
|
|
||
|
|
* **ES الوحدات**
|
||
|
|
|
||
|
|
* تحدد [مواصفات ES Modules](https://html.spec.whatwg.org/multipage/webappapis.html#integration-with-the-javascript-module-system) التضمين وإعادة استخدام مستندات JS في معيار معياري وفعال.
|
||
|
|
|
||
|
|
* **قالب HTML**
|
||
|
|
|
||
|
|
* تحدد [مواصفات عنصر قالب HTML](https://html.spec.whatwg.org/multipage/scripting.html#the-template-element/) كيفية الإعلان أجزاء من الترميز غير المستخدمة عند تحميل الصفحة ، ولكن يمكن إنشاء مثيل لها في وقت لاحق في وقت التشغيل.
|
||
|
|
|
||
|
|
|
||
|
|
### معلومات اكثر:
|
||
|
|
|
||
|
|
* [مقدمة لمكونات الويب](https://www.webcomponents.org/introduction)
|
||
|
|
* [بيان الويب القابل للتوسعة](https://github.com/extensibleweb/manifesto)
|
||
|
|
* [W3C Web Component Specification](https://w3c.github.io/webcomponents/explainer/)
|