freeCodeCamp/give-links-meaning-by-using-descriptive-link-text.chinese.md at f111fa05c8a349cb15a479f109968e14660c83b4

Files

Beau Carnes 2ca3a2093f Add languages Russian, Arabic, Chinese, Portuguese (#18305 )

2018-10-11 03:33:03 +05:30

2.3 KiB

Raw Blame History

id, title, challengeType, videoUrl, localeTitle

id	title	challengeType	videoUrl	localeTitle
587d778f367417b2b2512aae	Give Links Meaning by Using Descriptive Link Text	0		通过使用描述性链接文本给出链接含义

Description

屏幕阅读器用户对其设备读取的内容类型有不同的选择。这包括跳过（或覆盖）地标元素，跳转到主要内容或从标题中获取页面摘要。另一种选择是仅听取页面上可用的链接。屏幕阅读器通过阅读链接文本或锚（ a ）标签之间的内容来完成此操作。列出“点击此处”或“阅读更多”链接无济于事。相反，您应该在a标签中使用简短但具有描述性的文本，以便为这些用户提供更多意义。

Instructions

如果没有周围的上下文，Camper Cat正在使用的链接文本不是很具描述性。移动锚（ a ）标签，使它们环绕文本“有关电池的信息”而不是“点击此处”。

Tests

tests:
  - text: 您的代码应移动锚点<code>a</code>来自各地的词“点击这里”标签环绕中的“关于电池的信息”。
    testString: 'assert($("a").text().match(/^(information about batteries)$/g), "Your code should move the anchor <code>a</code> tags from around the words "Click here" to wrap around the words "information about batteries".");'
  - text: 确保您<code>a</code>元素具有结束标记。
    testString: 'assert(code.match(/<\/a>/g) && code.match(/<\/a>/g).length === code.match(/<a href=(""|"")>/g).length, "Make sure your <code>a</code> element has a closing tag.");'

Challenge Seed

<body>
  <header>
    <h1>Deep Thoughts with Master Camper Cat</h1>
  </header>
  <article>
    <h2>Defeating your Foe: the Red Dot is Ours!</h2>
    <p>Felines the world over have been waging war on the most persistent of foes. This red nemesis combines both cunning stealth and lightening speed. But chin up, fellow fighters, our time for victory may soon be near. <a href="">Click here</a> for information about batteries</p>
  </article>
</body>

Solution

// solution required

2.3 KiB Raw Blame History Unescape Escape