mirror of
https://github.com/freeCodeCamp/freeCodeCamp.git
synced 2026-02-25 14:01:29 -05:00
chore(i18n,learn): processed translations (#47415)
This commit is contained in:
camperbot
@@ -0,0 +1,63 @@
|
||||
---
|
||||
id: 5f07be6ef7412fbad0c5626b
|
||||
title: ステップ 15
|
||||
challengeType: 0
|
||||
dashedName: step-15
|
||||
---
|
||||
|
||||
# --description--
|
||||
|
||||
新しいコンテンツを追加する前に、`section` 要素を利用して猫の写真とこれから追加するコンテンツを分けましょう。
|
||||
|
||||
現在 `main` 要素内にあるすべての要素を、`section` 要素の中にネストしましょう。
|
||||
|
||||
# --hints--
|
||||
|
||||
`section` 要素には開始タグが必要です。 開始タグは `<elementName>` のような形式の構文です。
|
||||
|
||||
```js
|
||||
assert(document.querySelector('section'));
|
||||
```
|
||||
|
||||
`section` 要素には終了タグが必要です。 終了タグは `<` の直後に `/` があります。
|
||||
|
||||
```js
|
||||
assert(code.match(/<\/section\>/));
|
||||
```
|
||||
|
||||
`section` 要素全体が、`main` 要素の開始タグと終了タグの間にあるようにしてください。
|
||||
|
||||
```js
|
||||
assert(document.querySelector('section').parentNode.nodeName === 'MAIN');
|
||||
```
|
||||
|
||||
既存の `h2` 要素、コメント、`p` 要素、アンカー (`a`) 要素が、`section` 要素の開始タグと終了タグの間にあるようにしてください。
|
||||
|
||||
```js
|
||||
const childrenOfSection = [...document.querySelector('section').childNodes];
|
||||
const foundElems = childrenOfSection.filter((child) => {
|
||||
return ['H2', 'A', 'P'].includes(child.nodeName);
|
||||
});
|
||||
assert(foundElems.length === 3);
|
||||
```
|
||||
|
||||
# --seed--
|
||||
|
||||
## --seed-contents--
|
||||
|
||||
```html
|
||||
<html>
|
||||
<body>
|
||||
<h1>CatPhotoApp</h1>
|
||||
--fcc-editable-region--
|
||||
<main>
|
||||
<h2>Cat Photos</h2>
|
||||
<!-- TODO: Add link to cat photos -->
|
||||
<p>Click here to view more <a target="_blank" href="https://freecatphotoapp.com">cat photos</a>.</p>
|
||||
<a href="https://freecatphotoapp.com"><img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/relaxing-cat.jpg" alt="A cute orange cat lying on its back."></a>
|
||||
</main>
|
||||
--fcc-editable-region--
|
||||
</body>
|
||||
</html>
|
||||
```
|
||||
|
||||
@@ -0,0 +1,81 @@
|
||||
---
|
||||
id: 5f07c98cdb9413cbd4b16750
|
||||
title: ステップ 16
|
||||
challengeType: 0
|
||||
dashedName: step-16
|
||||
---
|
||||
|
||||
# --description--
|
||||
|
||||
では新しいセクションを追加しましょう。 既存の `section` 要素の下に、2 つ目の `section` 要素を追加してください。
|
||||
|
||||
# --hints--
|
||||
|
||||
`section` 要素には開始タグが必要です。 開始タグは `<elementName>` のような形式の構文です。
|
||||
|
||||
```js
|
||||
assert(document.querySelectorAll('section').length >= 2);
|
||||
```
|
||||
|
||||
`section` の開始タグは 1 つだけ追加してください。 余分なものは削除してください。
|
||||
|
||||
```js
|
||||
assert(document.querySelectorAll('section').length === 2);
|
||||
```
|
||||
|
||||
`section` 要素には終了タグが必要です。 終了タグは `<` の直後に `/` があります。
|
||||
|
||||
```js
|
||||
assert(code.match(/<\/section>/g).length >= 2);
|
||||
```
|
||||
|
||||
`section` の終了タグは 1 つだけ追加してください。 余分なものは削除してください。
|
||||
|
||||
```js
|
||||
assert(code.match(/<\/section>/g).length === 2);
|
||||
```
|
||||
|
||||
2 つ目の `section` 要素を 1 つ目の `section` 要素の中にネストしないでください。
|
||||
|
||||
```js
|
||||
const childrenOf1stSection = [
|
||||
...document.querySelector('main > section').children
|
||||
];
|
||||
const foundElems = childrenOf1stSection.filter((child) => {
|
||||
return child.nodeName === 'SECTION';
|
||||
});
|
||||
assert(foundElems.length === 0);
|
||||
```
|
||||
|
||||
両方の `section` 要素が、`main` 要素の開始タグと終了タグの間にあるようにしてください。
|
||||
|
||||
```js
|
||||
const childrenOfMain = [...document.querySelector('main').children];
|
||||
const foundElems = childrenOfMain.filter((child) => {
|
||||
return child.nodeName === 'SECTION';
|
||||
});
|
||||
assert(foundElems.length === 2);
|
||||
```
|
||||
|
||||
# --seed--
|
||||
|
||||
## --seed-contents--
|
||||
|
||||
```html
|
||||
<html>
|
||||
<body>
|
||||
<h1>CatPhotoApp</h1>
|
||||
<main>
|
||||
--fcc-editable-region--
|
||||
<section>
|
||||
<h2>Cat Photos</h2>
|
||||
<!-- TODO: Add link to cat photos -->
|
||||
<p>Click here to view more <a target="_blank" href="https://freecatphotoapp.com">cat photos</a>.</p>
|
||||
<a href="https://freecatphotoapp.com"><img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/relaxing-cat.jpg" alt="A cute orange cat lying on its back."></a>
|
||||
</section>
|
||||
--fcc-editable-region--
|
||||
</main>
|
||||
</body>
|
||||
</html>
|
||||
```
|
||||
|
||||
@@ -0,0 +1,98 @@
|
||||
---
|
||||
id: 5f07fb1579dc934717801375
|
||||
title: ステップ 32
|
||||
challengeType: 0
|
||||
dashedName: step-32
|
||||
---
|
||||
|
||||
# --description--
|
||||
|
||||
では新しいセクションを追加しましょう。 3 つ目の `section` 要素を、2 つ目の `section` 要素の下に追加してください。
|
||||
|
||||
# --hints--
|
||||
|
||||
`section` 要素には開始タグが必要です。 開始タグは `<elementName>` のような形式の構文です。
|
||||
|
||||
```js
|
||||
assert(document.querySelectorAll('section').length >= 3);
|
||||
```
|
||||
|
||||
`section` の開始タグは 1 つだけ追加してください。 余分なものは削除してください。
|
||||
|
||||
```js
|
||||
assert(document.querySelectorAll('section').length === 3);
|
||||
```
|
||||
|
||||
`section` 要素には終了タグが必要です。 終了タグは `<` の直後に `/` があります。
|
||||
|
||||
```js
|
||||
assert(code.match(/<\/section>/g).length >= 3);
|
||||
```
|
||||
|
||||
`section` の終了タグは 1 つだけ追加してください。 余分なものは削除してください。
|
||||
|
||||
```js
|
||||
assert(code.match(/<\/section>/g).length === 3);
|
||||
```
|
||||
|
||||
すべての `section` 要素が、`main` 要素の開始タグと終了タグの間にあるようにしてください。
|
||||
|
||||
```js
|
||||
const childrenOfMain = [...document.querySelector('main').children];
|
||||
const sectionElemsFound = childrenOfMain.filter((child) => {
|
||||
return child.nodeName === 'SECTION';
|
||||
});
|
||||
assert(sectionElemsFound.length === 3);
|
||||
```
|
||||
|
||||
最後の `section` 要素には中身がないようにしてください。 最後の `section` 要素の中の HTML 要素やテキストは削除してください。
|
||||
|
||||
```js
|
||||
assert($('main > section')[2].children.length === 0);
|
||||
```
|
||||
|
||||
# --seed--
|
||||
|
||||
## --seed-contents--
|
||||
|
||||
```html
|
||||
<html>
|
||||
<body>
|
||||
<h1>CatPhotoApp</h1>
|
||||
<main>
|
||||
<section>
|
||||
<h2>Cat Photos</h2>
|
||||
<!-- TODO: Add link to cat photos -->
|
||||
<p>Click here to view more <a target="_blank" href="https://freecatphotoapp.com">cat photos</a>.</p>
|
||||
<a href="https://freecatphotoapp.com"><img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/relaxing-cat.jpg" alt="A cute orange cat lying on its back."></a>
|
||||
</section>
|
||||
--fcc-editable-region--
|
||||
<section>
|
||||
<h2>Cat Lists</h2>
|
||||
<h3>Things cats love:</h3>
|
||||
<ul>
|
||||
<li>cat nip</li>
|
||||
<li>laser pointers</li>
|
||||
<li>lasagna</li>
|
||||
</ul>
|
||||
<figure>
|
||||
<img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/lasagna.jpg" alt="A slice of lasagna on a plate.">
|
||||
<figcaption>Cats <em>love</em> lasagna.</figcaption>
|
||||
</figure>
|
||||
<h3>Top 3 things cats hate:</h3>
|
||||
<ol>
|
||||
<li>flea treatment</li>
|
||||
<li>thunder</li>
|
||||
<li>other cats</li>
|
||||
</ol>
|
||||
<figure>
|
||||
<img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/cats.jpg" alt="Five cats looking around a field.">
|
||||
<figcaption>Cats <strong>hate</strong> other cats.</figcaption>
|
||||
</figure>
|
||||
</section>
|
||||
--fcc-editable-region--
|
||||
</main>
|
||||
</body>
|
||||
</html>
|
||||
```
|
||||
|
||||
Reference in New Issue
Block a user