Как взаимодействует ООП с DOM?

Question

[szQocks]

Могу отдельно манипулировать домом и писать ооп слабенько(классы,наследование,свойства и методы (приватные, не приватные,статические),наследование,обращение к родительскому классу , изменение его свойств или методов) вообще всё примерно в этом духе , но я не понимаю как правильно взаимодействует ООП с ДОМОМ ? неужели в методах обращаться к дом элементам , либо в методы передавать дом элементы и на такой основе манипулировать ими?в общем - в этой теме я не догоняю и прошу тех кто в курсе всего этого , возможно есть инфа которую я не прочел, то будьте добры скиньте ссылочки, или на пальцах объясните мне что к чему, не хочу при первом своём трудоустройстве - облажаться и что бы на меня посмотрели как на мамонта. Как правильно комбинировать ооп с домом ? отдельно то получается вроде как...

Comments

[Александр]

ОПП это ОПП, DOM это DOM. У DOM есть методы и свойства, используйте их как использовали в чём проблема?

[szQocks]

z80b, есть какие-нибудь примеры или проекты манипуляции домом при помощи ооп подхода? Я бы их глянул, код ...:|

[Александр]

Или вопрос в том как организовать код? Можно например в конструкторе проинициализировать свойства присвоив им ссылки на элементы DOM-a.

class Slider {
  constructor(el) {
    this.nextButton = el.querySelector('.next-arrow');
    this.prevtButton = el.querySelector('.prev-arrow');
  },

  initEvents() {
    this.nextButton.addEventListener('click', this.clickNext);
  },
  ...

  clickNext() {
    ...
  },
}

const slider = new Slider(document.querySelector('.my-slider'));

что-то в этом роде...

[szQocks]

z80b, Да скорее всего в этом был вопрос, спасибо хоть и малость но очень полезная инфа для меня.

Answer 1

[drawnofmymind]

Best Practice https://github.com/vladilenm/select-plugin

Comments

[szQocks]

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

[drawnofmymind]

szQocks, еще видео есть на руском)

[szQocks]

drawnofmymind, уже нашел в ютубе, спасибо.

[drawnofmymind]

Bavashi, Думаю вопрос заключался в понимании принципа взаимодействия ооп с дом)

[szQocks]

Bavashi, Слушай если тебе не сложно можешь реализовать аккордион применяя ООП js?
входные параметры const accordion = new Accordion([1,2,3,4,5])

Пусть верстка будет самая убогая , мне это не важно, главное посмотреть принцип работы. На 80% уверен что ты делать не будешь , откажешься либо вообще ничего не ответишь.

[szQocks]

Bavashi, если сделаешь я тебе 100р переведу куда скажешь , чисто за реализацию 10-20 минутного аккордиона.