|
|
@@ -1,253 +0,0 @@
|
|
|
-// Материал
|
|
|
-// Просмотрите, запустите и внимательно проанализируйте все примеры кода из материала лекции.
|
|
|
-{
|
|
|
- // сделано
|
|
|
-}
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
-// Literals
|
|
|
-// Найдите несколько окружающих объектов реального мира и создайте соответственные объекты Javascript.Например:
|
|
|
-{
|
|
|
- const flover = {
|
|
|
- type: 'palm',
|
|
|
- height: 150,
|
|
|
- color: 'green'
|
|
|
- }
|
|
|
-
|
|
|
- const dog = {
|
|
|
- type: 'york',
|
|
|
- sex: 'female',
|
|
|
- color: 'red'
|
|
|
- }
|
|
|
-
|
|
|
- const wife = {
|
|
|
- type: 'creator',
|
|
|
- sex: 'female',
|
|
|
- height: 165
|
|
|
- }
|
|
|
-}
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
-// Literals expand
|
|
|
-// Дайте возможность пользователю добавить любые два свойства в эти объекты с любыми значениями.Обеспечьте ввод названия ключа и значения через prompt прямо в литерале объекта { }
|
|
|
-{
|
|
|
- const flover = {
|
|
|
- type: 'palm',
|
|
|
- height: 150,
|
|
|
- color: 'green',
|
|
|
- [prompt('Введите первый параметр для объекта "Цветок"')]: prompt('Введите описание этого параметра'),
|
|
|
- [prompt('Введите второй параметр для объекта "Цветок"')]: prompt('Введите описание этого параметра')
|
|
|
- }
|
|
|
-
|
|
|
- const dog = {
|
|
|
- type: 'york',
|
|
|
- sex: 'female',
|
|
|
- color: 'red',
|
|
|
- [prompt('Введите первый параметр для объекта "Собака"')]: prompt('Введите описание этого параметра'),
|
|
|
- [prompt('Введите второй параметр для объекта "Собака"')]: prompt('Введите описание этого параметра')
|
|
|
- }
|
|
|
-
|
|
|
- const wife = {
|
|
|
- type: 'creator',
|
|
|
- sex: 'female',
|
|
|
- height: 165,
|
|
|
- [prompt('Введите первый параметр для объекта "Жена"')]: prompt('Введите описание этого параметра'),
|
|
|
- [prompt('Введите второй параметр для объекта "Жена"')]: prompt('Введите описание этого параметра')
|
|
|
- }
|
|
|
-}
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
-// Literals copy
|
|
|
-// Пусть пользователь введет еще одно свойство в переменную.Вставьте в новый объект эту переменную.Скопируйте объект из предыдущего задания в новый объект.
|
|
|
-{
|
|
|
-
|
|
|
-}
|
|
|
-
|
|
|
-
|
|
|
-// Html tree - НЕ РЕШЕНО ДО КОНЦА (последние два пункта не сделаны)
|
|
|
-// Сделайте декларативную JSON - структуру для тэгов выше, в которой:
|
|
|
-// каждый тэг будет объектом
|
|
|
-// имя тэга будет полем tagName
|
|
|
-// вложенные тэги будут в поле children
|
|
|
-// набор аттрибутов тэга будет в поле attrs.
|
|
|
-// Например для обычной таблицы 2x2 это будет выглядеть следующим образом:
|
|
|
-// Выведите значения текста во второй кнопке, используя.и[].
|
|
|
-// Выведите значение атрибута id во втором input, используя.и[].
|
|
|
-{
|
|
|
- const dataInput = {
|
|
|
- tagName: 'body',
|
|
|
- children: [
|
|
|
- {
|
|
|
- nameTag: 'div',
|
|
|
- children: [
|
|
|
- {
|
|
|
- tagName: 'span',
|
|
|
- children: ['Enter a data please:']
|
|
|
- },
|
|
|
- {
|
|
|
- tagName: 'br'
|
|
|
- },
|
|
|
- {
|
|
|
- tagName: 'input',
|
|
|
- attrs: {
|
|
|
- type: 'text',
|
|
|
- id: 'name'
|
|
|
- }
|
|
|
- },
|
|
|
- {
|
|
|
- tagName: 'input',
|
|
|
- attrs: {
|
|
|
- type: 'text',
|
|
|
- id: 'surname'
|
|
|
- }
|
|
|
- }
|
|
|
- ]
|
|
|
- },
|
|
|
- {
|
|
|
- nameTag: 'div',
|
|
|
- children: [
|
|
|
- {
|
|
|
- tagName: 'button',
|
|
|
- attrs: {
|
|
|
- id: 'ok'
|
|
|
- },
|
|
|
- children: ['OK']
|
|
|
- },
|
|
|
- {
|
|
|
- tagName: 'button',
|
|
|
- attrs: {
|
|
|
- id: 'cancel'
|
|
|
- },
|
|
|
- children: ['Cancel']
|
|
|
- }
|
|
|
- ]
|
|
|
- }
|
|
|
- ]
|
|
|
- }
|
|
|
-}
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
-// Parent
|
|
|
-// Добавьте каждому объекту тэга из предыдущего задания связь с родителем, используя свойство parent и присвоение
|
|
|
-{
|
|
|
- const dataInput = {
|
|
|
- tagName: 'body',
|
|
|
- children: [
|
|
|
- {
|
|
|
- nameTag: 'div',
|
|
|
- children: [
|
|
|
- {
|
|
|
- tagName: 'span',
|
|
|
- children: ['Enter a data please:']
|
|
|
- },
|
|
|
- {
|
|
|
- tagName: 'br'
|
|
|
- },
|
|
|
- {
|
|
|
- tagName: 'input',
|
|
|
- attrs: {
|
|
|
- type: 'text',
|
|
|
- id: 'name'
|
|
|
- }
|
|
|
- },
|
|
|
- {
|
|
|
- tagName: 'input',
|
|
|
- attrs: {
|
|
|
- type: 'text',
|
|
|
- id: 'surname'
|
|
|
- }
|
|
|
- }
|
|
|
- ]
|
|
|
- },
|
|
|
- {
|
|
|
- nameTag: 'div',
|
|
|
- children: [
|
|
|
- {
|
|
|
- tagName: 'button',
|
|
|
- attrs: {
|
|
|
- id: 'ok'
|
|
|
- },
|
|
|
- children: ['OK']
|
|
|
- },
|
|
|
- {
|
|
|
- tagName: 'button',
|
|
|
- attrs: {
|
|
|
- id: 'cancel'
|
|
|
- },
|
|
|
- children: ['Cancel']
|
|
|
- }
|
|
|
- ]
|
|
|
- }
|
|
|
- ]
|
|
|
- }
|
|
|
- dataInput.children[0].father = dataInput
|
|
|
- dataInput.children[1].father = dataInput
|
|
|
- dataInput.children[1].father = dataInput
|
|
|
- dataInput.children[0].children[0].father = dataInput.children[0]
|
|
|
- dataInput.children[0].children[1].father = dataInput.children[0]
|
|
|
- dataInput.children[0].children[2].father = dataInput.children[0]
|
|
|
- dataInput.children[0].children[3].father = dataInput.children[0]
|
|
|
- dataInput.children[1].children[0].father = dataInput.children[1]
|
|
|
- dataInput.children[1].children[1].father = dataInput.children[1]
|
|
|
-}
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
-// Change OK - НЕ РЕШЕНО!!!!!!
|
|
|
-// Добавьте(или измените) любой введенный пользователем атрибут тэга < button id = 'ok' > из задания HTML Tree.Пользователь также вводит значение этого атрибута.
|
|
|
-{
|
|
|
- const dataInput = {
|
|
|
- tagName: 'body',
|
|
|
- children: [
|
|
|
- {
|
|
|
- nameTag: 'div',
|
|
|
- children: [
|
|
|
- {
|
|
|
- tagName: 'span',
|
|
|
- children: ['Enter a data please:']
|
|
|
- },
|
|
|
- {
|
|
|
- tagName: 'br'
|
|
|
- },
|
|
|
- {
|
|
|
- tagName: 'input',
|
|
|
- attrs: {
|
|
|
- type: 'text',
|
|
|
- id: 'name'
|
|
|
- }
|
|
|
- },
|
|
|
- {
|
|
|
- tagName: 'input',
|
|
|
- attrs: {
|
|
|
- type: 'text',
|
|
|
- id: 'surname'
|
|
|
- }
|
|
|
- }
|
|
|
- ]
|
|
|
- },
|
|
|
- {
|
|
|
- nameTag: 'div',
|
|
|
- children: [
|
|
|
- {
|
|
|
- tagName: 'button',
|
|
|
- attrs: {
|
|
|
- id: 'ok'
|
|
|
- },
|
|
|
- children: ['OK']
|
|
|
- },
|
|
|
- {
|
|
|
- tagName: 'button',
|
|
|
- attrs: {
|
|
|
- id: 'cancel'
|
|
|
- },
|
|
|
- children: ['Cancel']
|
|
|
- }
|
|
|
- ]
|
|
|
- }
|
|
|
- ]
|
|
|
- }
|
|
|
-}
|
