logo

جافا سكريبت مجموعة السمة ()

ال مجموعة السمة () يتم استخدام الطريقة لتعيين أو إضافة سمة إلى عنصر معين وتوفير قيمة لها. إذا كانت السمة موجودة بالفعل، فإنها تقوم فقط بتعيين قيمة السمة أو تغييرها. لذلك، يمكننا أيضًا استخدام مجموعة السمة () طريقة لتحديث قيمة السمة الموجودة. إذا كانت السمة المقابلة غير موجودة، فسيتم إنشاء سمة جديدة بالاسم والقيمة المحددين. هذه الطريقة لا ترجع أي قيمة. يتحول اسم السمة تلقائيًا إلى أحرف صغيرة عندما نستخدمها في عنصر HTML.

على الرغم من أننا يمكن أن نضيف أسلوب السمة باستخدام مجموعة السمة () الطريقة، ولكن يوصى بعدم استخدام هذه الطريقة للتصفيف. لإضافة الأنماط، يمكننا استخدام خصائص كائن النمط الذي سيغير النمط بشكل فعال. يمكن أن يكون واضحا مع الكود التالي.

طريقة غير صحيحة

ما هو 25 من 100

يوصى بعدم استخدامه لتغيير النمط.

 element.setAttribute('style', 'background-color: blue;'); 

طريقة صحيحة

الطريقة الصحيحة لتغيير النمط موضحة أدناه.

 element.setAttribute.backgroundColor = 'blue'; 

للحصول على قيمة السمة، يمكننا استخدام الحصول على سمة () الطريقة، ولإزالة سمة معينة من عنصر ما، يمكننا استخدام إزالة أتريبوتي () طريقة.

إذا كنا نضيف سمة منطقية مثل عاجز ، فمهما كانت قيمته، فإنه يعتبر دائمًا كذلك حقيقي . إذا أردنا تعيين قيمة السمة المنطقية على خطأ شنيع ، يتعين علينا إزالة السمة بأكملها باستخدام إزالة السمة () طريقة .

بناء الجملة

 element.setAttribute(attributeName, attributeValue) 

وسيطات هذه الطريقة ليست اختيارية. يجب تضمين كلا المعلمتين عند استخدام هذه الطريقة. يتم تعريف قيم المعلمات لهذه الطريقة على النحو التالي.

قيمه المعامل

اسم السمة: إنه اسم السمة التي نريد إضافتها إلى العنصر. لا يمكن تركها فارغة؛ أي أنها ليست اختيارية.

قيمة السمة: إنها قيمة السمة التي نضيفها إلى العنصر. كما أنها ليست قيمة اختيارية.

تحويل السلسلة إلى int Java

دعونا نفهم كيفية الاستخدام مجموعة السمة () الطريقة باستخدام بعض الرسوم التوضيحية.

مثال 1

في هذا المثال، نقوم بإضافة أ href السمة بقيمة 'https://www.javatpoint.com/' إلى علامة مع معرف = 'رابط' .

 JavaScript setAttribute() method function fun() { document.getElementById(&apos;link&apos;).setAttribute(&apos;href&apos;, &apos;https://www.javatpoint.com/&apos;); } <h2> It is an example of adding an attribute using the setAttribute() method. </h2> <a id="link"> javaTpoint.com </a> <p> Click the follwing button to see the effect. </p> Add attribute 
اختبره الآن

انتاج |

بعد تنفيذ الكود أعلاه سيكون الناتج -

جافا سكريبت مجموعة السمة ()

يمكننا أن نرى أنه قبل النقر على الزر المحدد، لم يتم إنشاء الرابط. بعد الضغط على الزر سيكون الناتج -

جافا سكريبت مجموعة السمة ()

الآن، يمكننا أن نرى أنه تم إنشاء الرابط.

مثال2

في هذا المثال، نقوم بتحديث قيمة السمة الموجودة باستخدام مجموعة السمة () طريقة. نقوم هنا بتحويل حقل النص إلى زر عن طريق تغيير قيمة يكتب صفة من نص ل زر .

يتعين علينا النقر فوق الزر المحدد لرؤية التأثير.

 JavaScript setAttribute() method function fun() { document.getElementById(&apos;change&apos;).setAttribute(&apos;type&apos;, &apos;button&apos;); } <h2> It is an example to update an attribute&apos;s value using the setAttribute() method. </h2> <p> Click the follwing button to see the effect. </p> Change 
اختبره الآن

انتاج |

بعد تنفيذ الكود أعلاه سيكون الناتج -

جافا سكريبت مجموعة السمة ()

بعد الضغط على الزر سيكون الناتج -

التحقق من جافا فارغة
جافا سكريبت مجموعة السمة ()

مثال3

هنا نقوم بإضافة سمة منطقية عاجز لتعطيل الزر المحدد. إذا قمنا بتعيين قيمة عاجز سمة إلى سلسلة فارغة، ثم يتم تعيينها تلقائيًا على 'صحيح' مما يؤدي إلى تعطيل الزر.

 JavaScript setAttribute() method function fun() { document.getElementById(&apos;btn&apos;).setAttribute(&apos;disabled&apos;, &apos;&apos;); } <h2> Example of the setAttribute() method. </h2> <p> Click the following button to see the effect </p> Click me 
اختبره الآن

انتاج |

بعد تنفيذ الكود أعلاه سيكون الناتج -

جافا سكريبت مجموعة السمة ()

بعد الضغط على الزر سيكون الناتج -

جافا سكريبت مجموعة السمة ()