--- id: bad88fee1348bd9aedf08816 title: Link to Internal Sections of a Page with Anchor Elements challengeType: 0 videoUrl: 'https://scrimba.com/p/pVMPUv/cyrDRUL' forumTopicId: 301098 localeTitle: 用 a 实现网页内部跳转 --- ## Description
a 元素还可以用来实现页面内不同区域的跳转,只需要把a元素的href值设置为井号#加欲跳转区域对应的id值即可。id是描述网页元素的一个属性,它的值在整个页面中唯一。 下面是用来创建内部 a 的例子: ```html Contacts ...

Contacts

``` 当用户点击了Contacts链接,页面就会跳转到网页的Contacts区域。
## Instructions
通过修改href属性为#footer来更改外部链接为内部链接,同时修改文本cat photosJump to Bottom。 移除 target="_blank" 属性,它会使得链接在新标签页中打开。 然后添加一个<footer>元素,它的id值为footer
## Tests
```yml tests: - text: '页面中应该只有一个 a 。' testString: assert($('a').length == 1); - text: '页面中应该只有一个footer元素。' testString: assert($('footer').length == 1); - text: 'ahref属性应为 "#footer"。' testString: assert($('a').eq(0).attr('href') == "#footer"); - text: 'a 不应该有target属性。' testString: assert(typeof $('a').eq(0).attr('target') == typeof undefined || $('a').eq(0).attr('target') == true); - text: 'a 的文本应为Jump to Bottom。' testString: assert($('a').eq(0).text().match(/Jump to Bottom/gi)); - text: 'footer元素的id属性应为 "footer"。' testString: assert($('footer').eq(0).attr('id') == "footer"); ```
## Challenge Seed
```html

CatPhotoApp

cat photos 一只仰卧着的萌猫

在大家心目中,猫是慵懒和可爱的化身,它可以睡饱了再起来吃饭,可以逗趣小耗子,可以卖得了萌,使得了坏,这样百变的小怪兽就集结在一只宠物上,怎能不惹人怜爱。 养猫有的时候,就是介于爱与恨之间,当你钦羡别人萌宠这么可爱的时候,你一定没有想过,猫咪会到处掉毛,甚至会屯老鼠,啃鞋子,用爪子爬门,你不理它,它就挠你,你要对它发脾气,它会比你更来劲。所以,猫咪慎入,没有一定的准备,切勿随便去侍养动物。它们一旦认定你了,你就是它们的主人,如果你抛弃它们,它们必定心中重创。 在大家心目中,猫是慵懒和可爱的化身,它可以睡饱了再起来吃饭,可以逗趣小耗子,可以卖得了萌,使得了坏,这样百变的小怪兽就集结在一只宠物上,怎能不惹人怜爱。

养猫有的时候,就是介于爱与恨之间,当你钦羡别人萌宠这么可爱的时候,你一定没有想过,猫咪会到处掉毛,甚至会屯老鼠,啃鞋子,用爪子爬门,你不理它,它就挠你,你要对它发脾气,它会比你更来劲。所以,猫咪慎入,没有一定的准备,切勿随便去侍养动物。它们一旦认定你了,你就是它们的主人,如果你抛弃它们,它们必定心中重创。 在大家心目中,猫是慵懒和可爱的化身,它可以睡饱了再起来吃饭,可以逗趣小耗子,可以卖得了萌,使得了坏,这样百变的小怪兽就集结在一只宠物上,怎能不惹人怜爱。 养猫有的时候,就是介于爱与恨之间,当你钦羡别人萌宠这么可爱的时候,你一定没有想过,猫咪会到处掉毛,甚至会屯老鼠,啃鞋子,用爪子爬门,你不理它,它就挠你,你要对它发脾气,它会比你更来劲。所以,猫咪慎入,没有一定的准备,切勿随便去侍养动物。它们一旦认定你了,你就是它们的主人,如果你抛弃它们,它们必定心中重创。

```
## Solution