رابط دلالات ، الكتابة وأفضل الممارسات.
عند رؤية هذا الموضوع في Javaeye ، كانت المناقشة مثيرة للاهتمام للغاية ، ولم أستطع إلا أن أشارك. التفكير الدلالي
بادئ ذي بدء ، فإن زر الرابط A وزر الزر دلالي ولا يمكن استبداله بسبب الراحة في الاستخدام. A هو اختصار المرساة ، نقطة مرساة تستخدم للتنقل أو تحديد موقعها. الاستخدام النموذجي هو:
<a href = http: //www.w3c.org/> w3c موقع الويب </a> <a name = Anchor-One> هذا هو موقع المرساة.
يمكنك أيضًا تحديد سمات الاسم و HREF في نفس الوقت. هذه هي المعرفة الأساسية. إذا كان لديك أي أسئلة ، فيرجى الرجوع إلى مواصفات HTML 4.01.
دعنا نتحدث عن الأزرار (بما في ذلك الزر و <إدخال نوع = زر /إرسال />). من الناحية الدلالية ، الزر هو جزء من النموذج ، ويرتبط الإجراء المشغل بالنموذج. إذا لم يكن هناك عملية نموذج على الإطلاق ، يجب ألا تستخدم الأزرار. أعط بعض الأمثلة:
الصورة أعلاه هي بعض الروابط ، على الرغم من أنها تبدو كزر ، فهي دلالة.
أزرار العرض والفرز في الشكل أعلاه هي نموذج التشغيل. من الناحية الدلالية ، من الأنسب لاستخدام زر أو إدخال. (ملاحظة: تستخدم صفحة نتائج بحث Taobao حاليًا A ، وهي من أجل التحسين التدريجي ، وسيتم ذكرها أدناه)
باختصار ، تحتوي الروابط والأزرار على سيناريوهات الدلالات والاستخدام الخاصة بها ولا يمكن استبدالها حسب الرغبة. تحليل الكتابة
العالم ليس بهذه البساطة. في JavaScript Web World اليوم ، غالبًا ما يتم استخدام الرابط A لإطلاق أحداث JS:
<a href = onClick = some ()> test 1 </a> <a href =# onClick = some () ؛ return false >> اختبار 2 </a> <a href = javaScript: void (0) onClick = some () >> اختبار 3 </a> <a href = javaScript: void شيء ()> اختبار 4 </a>
بادئ ذي بدء ، هناك مشكلة في طريقة الكتابة الأولى ، لأنه سيتم إكمال HREF تلقائيًا بموجب IE.
تمنع الطريقة الثانية لكتابته مباشرة الحدث الافتراضي في حدث OnClick ، لذلك يمكن أن يكون # في HREF = # أي قيمة. إن استخدام # هو النظر في أنه عندما لا يكون هناك JS ، فسيبقى على هذه الصفحة بعد النقر (ملاحظة: عندما تكون A أسفل شاشة واحدة ، فإن طريقة الكتابة هذه ستتسبب في إعادة الصفحة إلى الأعلى).
الطريقة الثالثة للكتابة هي أن قيمة HREF هي جافا سكريبت pseudo-protocol ، والباطرة هي عامل غير محدود لـ JavaScript (مثل! ، typeof). وظيفة مشغل الفراغ هي تنفيذ التعبير التالي فقط وعدم إرجاع أي قيمة. يبدو أن الفراغ (0) يمنع الحدث الافتراضي ، ولكن في الواقع ، فإن أساليب الكتابة التالية جيدة:
<a href = javaScript: void (1) onClick = some () >> test 3 </a> <a href = javaScript: ؛ OnClick = some () >> اختبار 3 </a> <a href = javaScript: onClick = some () >> اختبار 3 </a> <a href = javaScript: return true onclick = something () >> test 3 </a>
نظرًا لأن التشغيل الافتراضي لـ A هو محتوى JavaScript Pseudo-Protocol ، فإن إضافة باطل أو لا سيؤدي إلى تشغيل أحداث أخرى. (ملاحظة: تحت الأوبرا ، عندما تكون هناك قيمة إرجاع في البروتوكول الزائف ، سيتم تغيير HREF ، لذلك عادة ما نكتب باطلة (0) أو بيانات فارغة)
بعد فهم الطريقة الثالثة للكتابة ، ستفهم الطريقة الرابعة للكتابة: HREF = JavaScript: void something (). تتمثل إحدى ميزة بهذه الطريقة في أنه عند تعليق الماوس ، يمكن للمستخدم رؤية الوظيفة التي سيتم تنفيذها من خلال شريط الحالة. قد تكون هذه فائدة للمطورين ، ولكن للمستخدمين العاديين ، هل سيزيد هذا الثقة حقًا؟ أم أنه شعور بالخوف؟ بدون بيانات ، لا يمكنك استخلاص الاستنتاجات.
بالإضافة إلى طريقة الكتابة أعلاه ، هناك طريقة أخرى موصى بها للكتابة ، وهي إضافة خطاف إلى فئة أو معرف ، ثم إضافة الأحداث من خلال الخطاف في JS. انعكاس
لا أريد مناقشة أي من أنماط الكتابة أعلاه هي الأفضل. دعونا نفكر في سؤال الأصل: لماذا نستخدم A لتشغيل أحداث JS؟ الأسباب التي يمكن أن أفكر فيها هي:
يمكن ملاحظة أنه بصرف النظر عن الأسلوب العائم ، لا يوجد سبب كبير. دعنا نضع جانبا مشكلة الأسلوب في الوقت الحالي ونلقي نظرة على مثال:
ما سبق هو شريط تشغيل قارئ Google. إذا كنت مهتمًا ، فقد تطلق النار عليه أيضًا. العلامة المستخدمة هي:
لا يمثل نمط الماوس المعلق مشكلة على الإطلاق:
في CSS ، فقط أضف المؤشر: مؤشر.
من المثال أعلاه ، يمكننا استنتاج استنتاج: إذا قمت فقط بإجراء إجراء JS دون أي دلالات التنقل أو تحديد المواقع ، فيمكنك استخدام Span أو علامات أخرى مناسبة ، وليس هناك حاجة لاستخدامها بشكل غير صحيح (باستخدام A Will Will Trouble: أولاً ، تحتاج إلى إزالة الحدث الافتراضي ، والثاني ، المعلومات الواردة في شريط الحالة يربك أو حتى مستخدمي الخوف العادي).
بالطبع ، إذا كان ذلك رابطًا بحد ذاته ، فأنت تريد فقط إضافة بعض تطبيقات فرز JS أو تشكيلها قبل التنقل ، مع الأخذ في الاعتبار من منظور تعزيز تدريجي ، فإن أفضل الممارسات هي كتابة جميع قيم HREF بحيث لا يمكن ضمان قابلية الاستخدام في المتصفحات التي لا تدعم JS. أفضل الممارسات
إنه ليس ملخصًا ، فهو ليس إنهاء لمرة واحدة. أفضل الممارسات هي مجرد سلسلة من المبادئ. من الضروري التفكير في الأمر قبل كتابة الكود:
الرموز لها حياة ، Tag Kingdom هي حديقة حيوان ، على دراية بها ، كل شيء جميل.