freeCodeCamp

4.1 KiB

Raw Blame History

id	title	challengeType	videoUrl	localeTitle
587d7790367417b2b2512aaf	Make Links Navigatable with HTML Access Keys	0		جعل الروابط نافيجيتابل مع مفاتيح الوصول إلى HTML

Description

تقدم HTML و accesskey السمة لتحديد مفتاح الاختصار لتنشيط أو إحضار التركيز إلى عنصر. هذا يمكن أن يجعل التنقل أكثر كفاءة لمستخدمي لوحة المفاتيح فقط. تسمح HTML5 باستخدام هذه السمة على أي عنصر ، ولكنها مفيدة بشكل خاص عند استخدامها مع تلك التفاعلية. ويشمل ذلك الروابط والأزرار وعناصر التحكم في النموذج. إليك مثالاً: <button accesskey="b">Important Button</button>

Instructions

يريد Camper Cat أن تحتوي الروابط الموجودة حول عنوان مقالتي المدونة على اختصارات لوحة المفاتيح حتى يتمكن مستخدمو موقعه من الانتقال سريعًا إلى القصة الكاملة. إضافة سمة accesskey إلى كلا الارتباطين وتعيين أول واحد إلى "g" (لـ Garfield) والثاني إلى "c" (لـ Chuck Norris).

Tests

tests:
  - text: التعليمات البرمجية يجب إضافة و <code>accesskey</code> السمة إلى <code>a</code> العلامة مع <code>id</code> من &quot;لأول مرة&quot;.
    testString: 'assert($("#first").attr("accesskey"), "Your code should add an <code>accesskey</code> attribute to the <code>a</code> tag with the <code>id</code> of "first".");'
  - text: التعليمات البرمجية يجب إضافة و <code>accesskey</code> السمة إلى <code>a</code> العلامة مع <code>id</code> من &quot;الثاني&quot;.
    testString: 'assert($("#second").attr("accesskey"), "Your code should add an <code>accesskey</code> attribute to the <code>a</code> tag with the <code>id</code> of "second".");'
  - text: التعليمات البرمجية يجب تعيين <code>accesskey</code> السمة على <code>a</code> العلامة مع <code>id</code> من &quot;الأولى&quot; إلى &quot;ز&quot;. لاحظ أن القضية مهمة.
    testString: 'assert($("#first").attr("accesskey") == "g", "Your code should set the <code>accesskey</code> attribute on the <code>a</code> tag with the <code>id</code> of "first" to "g". Note that case matters.");'
  - text: التعليمات البرمجية يجب تعيين <code>accesskey</code> السمة على <code>a</code> العلامة مع <code>id</code> من ل&quot;ج&quot; &quot;ثانية&quot;. لاحظ أن القضية مهمة.
    testString: 'assert($("#second").attr("accesskey") == "c", "Your code should set the <code>accesskey</code> attribute on the <code>a</code> tag with the <code>id</code> of "second" to "c". Note that case matters.");'

Challenge Seed

<body>
  <header>
    <h1>Deep Thoughts with Master Camper Cat</h1>
  </header>
  <article>


    <h2><a id="first" href="">The Garfield Files: Lasagna as Training Fuel?</a></h2>


    <p>The internet is littered with varying opinions on nutritional paradigms, from catnip paleo to hairball cleanses. But let's turn our attention to an often overlooked fitness fuel, and examine the protein-carb-NOM trifecta that is lasagna...</p>
  </article>
  <article>


    <h2><a id="second" href="">Is Chuck Norris a Cat Person?</a></h2>


    <p>Chuck Norris is widely regarded as the premier martial artist on the planet, and it's a complete coincidence anyone who disagrees with this fact mysteriously disappears soon after. But the real question is, is he a cat person?...</p>
  </article>
  <footer>&copy; 2018 Camper Cat</footer>
</body>

Solution

// solution required

4.1 KiB Raw Blame History