--- id: bad87fee1348bd9aede08817 title: アンカー要素を段落内にネストする challengeType: 0 forumTopicId: 18244 dashedName: nest-an-anchor-element-within-a-paragraph --- # --description-- リンクは他のテキスト要素内にネストする (入れ子にする) ことができます。 ```html

Here's a link to www.freecodecamp.org for you to follow.

``` 上の例を詳しく見てみましょう。 通常のテキストが `p` 要素に囲まれています。 ```html

Here's a ... for you to follow.

``` 次は*アンカー*要素 `` です。 (終了タグ `` が必要です): ```html ... ``` `target` は、リンクをどこで開くかを指定するアンカータグの属性です。 `_blank` という値は、新しいタブでリンクを開くように指定します。 `href` は、リンクの URL を入れるアンカータグの属性です。 ```html ... ``` `a` 要素の中にあるテキスト `link to www.freecodecamp.org` は アンカーテキスト と呼ばれ、クリック可能なリンクとして表示されます。 ```html link to freecodecamp.org ``` 上の例の最終的な出力は次のようになります。 Here's a link to www.freecodecamp.org for you to follow. # --instructions-- 既存の `a` 要素を、新しい `p` 要素の中にネストしてください。 新しいアンカータグは作成しないようにしてください。 新しい段落要素は `View more cat photos` というテキストを持ち、`cat photos` はリンク、残りは通常のテキストになるようにしてください。 # --hints-- `a` 要素が 1 つだけあるようにしてください。 ```js assert( $('a').length === 1 ); ``` `a` 要素は "`https://www.freecatphotoapp.com`" にリンクする必要があります。 ```js assert( $('a[href="https://www.freecatphotoapp.com"]').length === 1 ); ``` `a` 要素は、`cat photos` というアンカーテキストを持つ必要があります。 ```js assert( $('a') .text() .match(/cat\sphotos/gi) ); ``` 新しい `p` 要素を作成してください。 HTML コードには、`p` タグが少なくとも合計 3 つあるはずです。 ```js assert($('p') && $('p').length > 2); ``` `a` 要素は新しく作成した `p` 要素の中にネストされている必要があります。 ```js assert( $('a[href="https://www.freecatphotoapp.com"]').parent().is('p') ); ``` `p` 要素には `View more` (その後に半角スペース) というテキストが必要です。 ```js assert( $('a[href="https://www.freecatphotoapp.com"]') .parent() .text() .match(/View\smore\s/gi) ); ``` `a` 要素には `View more` というテキストが含まれないようにしてください。 ```js assert( !$('a') .text() .match(/View\smore/gi) ); ``` それぞれの `p` 要素に終了タグが必要です。 ```js assert( code.match(/<\/p>/g) && code.match(/

/g).length === code.match(/

/g) && code.match(//g).length === code.match(/CatPhotoApp

cat photos A cute orange cat lying on its back.

Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.

Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.

``` # --solutions-- ```html

CatPhotoApp

View more cat photos

A cute orange cat lying on its back.

Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.

Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.

```