JavaScriptによる要素変更の実践

Задание 1

配列が与えられます。その要素を ul リストとして表示してください。

Задание 2

前の問題を修正し、任意の li をクリックすると、 編集可能な入力フィールドが表示されるようにしてください。

Задание 3

前の問題を修正し、リストの下に入力フィールドを追加し、 それを使って ul リストの末尾に新しい要素を追加できるようにしてください。 新しい li も編集可能にしてください。

Задание 4

前の問題を修正し、各 li の末尾に '削除' リンクを追加し、 そのリンクで ul からその li を削除できるようにしてください。

Задание 5

前の問題を修正し、各 li の末尾に '取り消し線' リンクも追加し、 そのリンクでその li タグのテキストに取り消し線を引けるようにしてください。

オブジェクトの配列とテーブル

Задание 6

次の従業員の配列が与えられます:

javascriptlet employees = [
  {name: 'employee1', age: 30, salary: 400},
  {name: 'employee2', age: 31, salary: 500},
  {name: 'employee3', age: 32, salary: 600},
];

これらの従業員をHTMLテーブルで表示してください。

Задание 7

作成したテーブルのセルを編集可能にしてください。

Задание 8

テーブルに新しい列を追加し、その列にはテーブルから行を削除するためのリンクを配置してください。

Задание 9

テーブルの下に 3 つの入力フィールドと新しい従業員を追加するボタンを配置してください。 入力フィールドには名前、年齢、給与を入力し、ボタンをクリックすると新しい従業員がテーブルに追加されるようにしてください。 新しく追加された従業員のセルも編集可能にしてください。

オブジェクトの配列とリスト

Задание 10

次の従業員の配列が与えられます:

javascriptlet employees = [
  {name: 'employee1', age: 30, salary: 400},
  {name: 'employee2', age: 31, salary: 500},
  {name: 'employee3', age: 32, salary: 600},
];

各従業員を、ul タグ内の独自の li タグに表示してください。

Задание 11

従業員の名前、年齢、または給与をクリックすると、そのフィールドを編集するための入力フィールドが表示されるようにしてください。

Задание 12

各 li タグの末尾に、リストからその li を削除するためのリンクを追加してください。

Задание 13

リストの下に、新しい従業員を追加するためのフォームを作成してください。