الانتقال إلى المحتوى الرئيسي

كيفية العثور على عنصر حسب سمة البيانات في جافا سكريبت: طريقة سهلة

جافا سكريبت هي واحدة من لغات البرمجة الأكثر شعبية المستخدمة في تطوير الشبكة. إحدى المهام المهمة التي قد نواجهها أثناء العمل مع جافا سكريبت هي البحث عن عناصر على صفحة الويب.

إحدى طرق البحث عن العناصر هي استخدام سمات البيانات. سمات عنصر هتمل بدءا من البادئة "البيانات-" يمكن استخدامها لتخزين المعلومات الإضافية التي قد تكون مطلوبة في جافا سكريبت.

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

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

  1. مفهوم سمة البيانات في جافا سكريبت
  2. مزايا استخدام سمات البيانات
  3. كيفية إضافة سمة بيانات إلى عنصر
  4. كيفية العثور على عنصر حسب سمة البيانات باستخدام طريقة كيريسيليكتور
  5. كيفية العثور على عنصر حسب سمة البيانات باستخدام طريقة جيتاتريبوت
  6. سؤال وجواب
  7. كيف يمكنني العثور على عنصر حسب سمة البيانات في جافا سكريبت?
  8. كيف أجد جميع العناصر حسب سمة البيانات?
  9. كيف يمكنني العثور على عنصر بقيمة محددة من سمة البيانات?
  10. هل من الممكن العثور على عنصر بناء على تطابق جزئي لقيمة سمة البيانات?

مفهوم سمة البيانات في جافا سكريبت

سمات البيانات هي سمات خاصة لعناصر هتمل تسمح لك بتخزين بيانات المستخدم. تبدأ بالبادئة" البيانات - "متبوعة باسم السمة (على سبيل المثال ،" اسم البيانات "أو"عمر البيانات").

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

مزايا استخدام سمات البيانات:

  1. الوضوح والدلالات: توفر سمات البيانات القدرة على وصف البيانات المخزنة في العنصر وتحديدها بوضوح ، مما يسهل فهم الكود والحفاظ عليه.
  2. سهولة الوصول إلى البيانات: تقدم جافا سكريبت خاصية مجموعة بيانات خاصة تتيح لك الوصول بسرعة وسهولة إلى قيم سمات البيانات للعناصر.
  3. المرونة: يمكن استخدام سمات البيانات لأغراض مختلفة ، على سبيل المثال ، لتخزين الإعدادات أو البيانات لمعالجة الأحداث أو لنقل المعلومات بين العناصر والبرامج النصية.

مثال على استخدام سمة البيانات:

إرسال

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

وبالتالي ، فإن استخدام سمات البيانات في جافا سكريبت يسمح لك بالعمل بشكل أكثر مرونة وسهولة مع البيانات الموجودة على صفحة الويب ، مما يجعل الكود أكثر قابلية للفهم ودعما.

مزايا استخدام سمات البيانات

يوفر استخدام سمات البيانات في عناصر هتمل عددا من المزايا التي تجعل العمل مع العناصر وبياناتها أكثر مرونة وكفاءة.

  1. بيانات المستخدم: تسمح لك سمات التاريخ بإضافة بيانات المستخدم إلى العناصر التي لا تؤثر على السلوك القياسي للمتصفح. هذا يسمح للمطورين لتخزين ونقل واستخدام بيانات إضافية على كل عنصر ، والتي يمكن أن تكون مفيدة جدا لأغراض مختلفة.
  2. التسلسل الهرمي المنطقي: باستخدام سمات البيانات ، يمكنك تنظيم العناصر الموجودة على الصفحة في تسلسل هرمي منطقي. على سبيل المثال ، إذا كانت لديك قائمة مهام ، فيمكنك استخدام سمات البيانات لتحديد المهمة الرئيسية لكل مهمة محددة. هذا يجعل من السهل تحديد المهام وتجميعها بالترتيب الصحيح.
  3. تحديد حالة العناصر: باستخدام سمات البيانات ، يمكنك تحديد حالة العناصر على الصفحة. على سبيل المثال ، يمكنك إضافة سمة البيانات "معطل" إلى زر للإشارة إلى أنها غير نشطة ، أو سمة البيانات "محدد" إلى عنصر قائمة للإشارة إلى أنه محدد.
  4. أو طرق دوم الأخرى. هذا مفيد بشكل خاص عند العمل بكميات كبيرة من البيانات أو عندما تحتاج إلى معالجة عناصر معينة في الصفحة.

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

كيفية إضافة سمة بيانات إلى عنصر

لإضافة سمة البيانات إلى عنصر في هتمل ، تحتاج إلى استخدام خاصية مجموعة بيانات خاصة في جافا سكريبت.

مثال:

أتش تي أم أل جافا سكريبت

عنصر كونست = وثيقة.جيتليمينتبيد ('مياليمنت');

على سبيل المثال ، للحصول على قيمة سمة البيانات ، يمكنك استخدام التعليمات البرمجية التالية:

جافا سكريبت

عنصر كونست = وثيقة.جيتليمينتبيد ('مياليمنت');

قيمة كونست = عنصر.مجموعة البيانات.مياتريبوت;

  • في هذا المثال ، نستخدم خاصية مجموعة البيانات واسم السمة "مياتريبوت" للحصول على قيمة سمة البيانات.
  • الآن أنت تعرف كيفية إضافة سمة البيانات إلى عنصر في هتمل وكيفية الحصول على قيمته باستخدام جافا سكريبت.
  • كيفية العثور على عنصر حسب سمة البيانات باستخدام طريقة كيريسيليكتور
  • - إنها أداة جافا سكريبت القوية التي تسمح لك لإيجاد عناصر على صفحة ويب باستخدام محددات المغلق.

    من أجل استخدام الطريقة

    يساوي

    لنأخذ مثالا. إذا كان لدينا رمز هتمل التالي:

    الركن 1

    الركن 2

    الركن 3

    1. يمكننا استخدام شفرة جافا سكريبت التالية للعثور على عنصر به
    2. معرف البيانات="2"
    3. :

    عنصر فار = وثيقة.كيريسيليكتور ('[معرف البيانات= "2"]');

    وحدة التحكم.سجل (عنصر.محتوى النص) ؛ / / المخرجات "العنصر 2"

    في هذا المثال ، نحفظ العنصر الموجود في متغير

    العنصر

    وإخراج محتوياته باستخدام الخاصية

    تكستكونتنت

    .

    باستخدام الطريقة

    كيريسيليكتور

    مع محددات سمة البيانات ، فإنه يسمح لك للعمل مع العناصر على صفحة استنادا إلى بيانات المستخدم الخاصة بهم ، مما يجعلها أداة مريحة جدا ومرنة للعمل مع هتمل وجافا سكريبت.

    كيفية العثور على عنصر حسب سمة البيانات باستخدام طريقة جيتاتريبوت

    طريقة جيتاتريبوت هي واحدة من الطرق التي يمكنك العثور على عنصر من قيمة سمة البيانات. تتيح لك هذه الطريقة الحصول على قيمة أي سمة لعنصر ما ، بما في ذلك سمة البيانات.

    للعثور على عنصر حسب قيمة سمة البيانات ، اتبع الخطوات التالية:

    حدد عنصر هتمل المطلوب الذي نريد العمل معه. على سبيل المثال ، يمكن أن يكون عنصرا مع علامة ديف.

    باستخدام طريقة جيتاتريبوت ، احصل على قيمة سمة البيانات. للقيام بذلك ، قم بتمرير اسم السمة إلى الطريقة كسلسلة ، دون تحديد علامة "البيانات". على سبيل المثال ، إذا كنت بحاجة إلى الحصول على قيمة سمة اسم البيانات ، فأنت بحاجة إلى تمرير القيمة "الاسم" إلى الطريقة.

    قارن القيمة المستلمة بالقيمة التي نحتاجها وقم بتنفيذ الإجراءات اللازمة اعتمادا على نتيجة المقارنة.

    مثال على التعليمات البرمجية التي توضح البحث عن عنصر بواسطة سمة البيانات باستخدام طريقة جيتاتريبوت:

    عنصر فار = وثيقة.('ديف') ؛ / / حدد العنصر المطلوب

    فار داتافالو = عنصر.جيتاتريبوت ('قيمة البيانات'); // الحصول على قيمة سمة قيمة البيانات