1.9 KiB
1.9 KiB
id, title, challengeType, forumTopicId, dashedName
id | title | challengeType | forumTopicId | dashedName |
---|---|---|---|---|
587d7fa6367417b2b2512bc3 | D3 で要素のグループを選択する | 6 | 301490 | select-a-group-of-elements-with-d3 |
--description--
D3 には、要素のグループを選択するための selectAll()
メソッドもあります。 このメソッドは、入力文字列に一致する、ドキュメント内のすべてのアイテムについて HTML ノードの配列を返します。 ドキュメント内のすべてのアンカータグを選択するには、例えば次のように記述します。
const anchors = d3.selectAll("a");
select()
メソッドと同様に、 selectAll()
はメソッドチェーンをサポートしており、他のメソッドと併用できます。
--instructions--
ドキュメント内のすべての li
タグを選択し、次に、.text()
メソッドをチェーンすることによりテキストを文字列 list item
に変更してください。
--hints--
ページ上に li
要素が 3 個あり、それぞれのテキストが list item
になっている必要があります。 大文字とスペースの使い方が厳密に一致する必要があります。
assert(
$('li')
.text()
.match(/list item/g).length == 3
);
d3
オブジェクトにアクセスする必要があります。
assert(code.match(/d3/g));
selectAll
メソッドを使用する必要があります。
assert(code.match(/\.selectAll/g));
--seed--
--seed-contents--
<body>
<ul>
<li>Example</li>
<li>Example</li>
<li>Example</li>
</ul>
<script>
// Add your code below this line
// Add your code above this line
</script>
</body>
--solutions--
<body>
<ul>
<li>Example</li>
<li>Example</li>
<li>Example</li>
</ul>
<script>
d3.selectAll("li")
.text("list item")
</script>
</body>