Size: a a a

Front-end developers

2020 October 21

AY

Alex Yuzviak in Front-end developers
Тимур Убайдуллаев
 let activeElement = document.getElementsByClassName('is-active-page')[0];

function changePage(element) {
 console.log(element);
 activeElement.classList.remove('is-active-page');
 activeElement = element;
 element.classList.add('is-active-page');
}

по быстрому накидал, тебе это надо?
большое спасибо
источник

AY

Alex Yuzviak in Front-end developers
Bohdan
Ну во первых, за вас никто не напишет решение.
Вам с пена могут подсказать где ошибка (логического или любого другого характера)
И описать алгоритм решения проблемы, так же скинуть ресурсы.

Во вторых, вам уже и алгоритм описали, и материал скинули.


1) Получаете текущий активный элемент. document.querySelector(ul li.current) ,  убираете класс
2) Получаете текущий элемент меню, на который кликнули (читайте материал, там есть про event.currentTarget) и добавляете к нему класс

Адаптируйте под себя, как минимум унифицировав селектор сугубо для этой секции
(дать уникальный класс либо списку, либо оберните список в определенный класс)
т.е что бы селектор был document.querySelector('.my-unique-class-name ul li.active);
большое спасибо
источник

B

Bahtiyar in Front-end developers
ребят, че то запутался. Есть массив с обьектами, наподобии этого [
{id: 1, name: one, image: src},
{id: 2, name: two, image: src1},
{id: 3, name, three, image: src2}
] получаю я его с апишки через fetch и мне надо вытащить конкретные свойства, например id и name и вставить их в html. как это сделать? знаю что надо форычом перебирать весь массив а дальше что то туплю
источник

B

Bohdan in Front-end developers
Bahtiyar
ребят, че то запутался. Есть массив с обьектами, наподобии этого [
{id: 1, name: one, image: src},
{id: 2, name: two, image: src1},
{id: 3, name, three, image: src2}
] получаю я его с апишки через fetch и мне надо вытащить конкретные свойства, например id и name и вставить их в html. как это сделать? знаю что надо форычом перебирать весь массив а дальше что то туплю
Что бы отрисовать что то в документе, можно воспользоваться одним из следующих вариантов:
1) Обработка строк. Сохранить нужный вам html в виде строки, и потом вывести через element.innerHTML
2) Написать функцию, которая сама создаст конкретный элемент при помощи связок document.createElement();
3) Воспользоваться фреймворком по типу react\vue\angular.  Не рекомендуется если не нужно писать что то со сложной логикой в интерфейсе. Если нужно умеренно что то рисовать, и при этом тут есть логика, то оптимальным вариантом будет  preact или если используете джейквери, то у него тоже есть апи для создания элементов страницы.

Так же учитывайте, что то что вы добавляете джаваскриптом очень плохо парситься поисковиками.
источник

VZ

Vasil Zozulya in Front-end developers
ему навернео просто дали тестовое)
источник

B

Bohdan in Front-end developers
Bahtiyar
ребят, че то запутался. Есть массив с обьектами, наподобии этого [
{id: 1, name: one, image: src},
{id: 2, name: two, image: src1},
{id: 3, name, three, image: src2}
] получаю я его с апишки через fetch и мне надо вытащить конкретные свойства, например id и name и вставить их в html. как это сделать? знаю что надо форычом перебирать весь массив а дальше что то туплю
Еще немного по сабжу.
Если вы уже написали логику для отрисовки, и в вашем цикле ожидается что обьект будет иметь скажем поле  ID
а с апи приходят обьекты с полем post_id  то в таком случае вы можете воспользоваться методом  Array.map();

получиться  так

let newArr = data.map((single_object)=> {
     return {  
           id:    single_object.post_id,
     }
});
источник

B

Bohdan in Front-end developers
Vasil Zozulya
ему навернео просто дали тестовое)
))
источник

B

Bahtiyar in Front-end developers
Vasil Zozulya
ему навернео просто дали тестовое)
да тестовое, дедлайн которого я просрал, но принципиально для себя хочу доделать, чтобы понять что да как делать
источник

С

Сергей Якунин... in Front-end developers
✌️ Привет народ
источник

NN

Nik Nik in Front-end developers
Сергей Якунин
✌️ Привет народ
ку
источник

МК

Макс Кравченко... in Front-end developers
Привет) Кто подскажет курсы в Киеве «Hillel» называется, отзывы только позитивные, может есть люди которые знают хороша ли в действительности? Буду благодарен за любую инфу)👌🏼👍🏼
источник

R

R in Front-end developers
Макс Кравченко
Привет) Кто подскажет курсы в Киеве «Hillel» называется, отзывы только позитивные, может есть люди которые знают хороша ли в действительности? Буду благодарен за любую инфу)👌🏼👍🏼
Привет
Хз, «Hillel» это в дневности оч влиятельный старый еврей-юрист
источник

R

R in Front-end developers
Я бы в такую школу не ходил
источник

МК

Макс Кравченко... in Front-end developers
Да, основатель насколько я знаю Еврей
источник

МК

Макс Кравченко... in Front-end developers
Но тем не менее, это не определяет ее как хорошую или плохую)
источник

N

Nika in Front-end developers
Ребят, хелп....

У кого есть время???
Глянь программы курсов... Какой лучше для старта??

Ось тримай нашу програму навчання по Front-End, зразу по двох блоках:

- Front-End Education [ Basic - перший блок:  HTML & CSS - 2 місяці ]
https://www.notion.so/Front-End-Education-Basic-curriculum-v1-1-5c28cf271e7b4ccca9dc1e30874425d9

- Front-End Education [ Advanced - другий блок: JS - 3 місяці ]
https://www.notion.so/Front-End-Education-Advanced-curriculum-a4243f2de35f435381b9323de7b62912

https://mainacademy.ua/courses/front-end-developer-online/
источник

v

v.fedchenko in Front-end developers
Всем привет.
Подскажите как можно реализовать данную структуру.
https://prnt.sc/v43ln7
Так выглядит расположение блоков на PC.
Как сделать так что на моб. Было: сначала "Третий" потом "второй", потом "четвертый" и "первый"?
Без display: grid.
источник

T

Tomorrow in Front-end developers
v.fedchenko
Всем привет.
Подскажите как можно реализовать данную структуру.
https://prnt.sc/v43ln7
Так выглядит расположение блоков на PC.
Как сделать так что на моб. Было: сначала "Третий" потом "второй", потом "четвертый" и "первый"?
Без display: grid.
Дисплей флекс не помогает?
Там можно менять порядок блоков
Но это не точно
источник

v

v.fedchenko in Front-end developers
Tomorrow
Дисплей флекс не помогает?
Там можно менять порядок блоков
Но это не точно
Так я и спрашиваю, потому что не получается
источник

T

Tomorrow in Front-end developers
v.fedchenko
Так я и спрашиваю, потому что не получается
В песочницу загрузи.
источник