Тёмный

Учим Java Script 14. Работаем с элементами и классами 

WebDev с нуля. Канал Алекса Лущенко
Просмотров 39 тыс.
50% 1

Опубликовано:

 

29 окт 2024

Поделиться:

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 120   
@другМаша
@другМаша 3 года назад
с ума сойти, всего 13 минут (а на х2 еще меньше), а сколько информации полезной!! Спасибо огромное!
@kellkomby86
@kellkomby86 7 лет назад
Благодаря вам я понял предназначение this и работу с ним. Спасибо большое)
@faust2134
@faust2134 5 лет назад
Тебя запутали, this работает не совсем так как показано в видео
@ВалерийДуняк
@ВалерийДуняк 7 лет назад
Отличные уроки - спасибо Вам за то, что делаете!
@itgid
@itgid 7 лет назад
Спасибо за комментарий. После таких слов хочется продолжать работать. Завтра будет еще один интересный урок посвященный практической реализации популярного в сети сервиса.
@komaibra7988
@komaibra7988 6 лет назад
спустя 2 года вашим урокам всё еще нет аналога)) спасибо вам за уроки
@itgid
@itgid 6 лет назад
Спасибо! Приятно!
@maximskliarenko7047
@maximskliarenko7047 4 года назад
даже спустя 4 года ....
@mrsuper21100
@mrsuper21100 4 года назад
@@itgid спустя еще 2 года нет аналогов)
@БезИмени-н2с2щ
@БезИмени-н2с2щ Год назад
@@itgid Привет из 2022, все еще нет аналогов
@ДаутКонджария
@ДаутКонджария 9 месяцев назад
2024, still the best lessons))
@adi4232
@adi4232 7 лет назад
самые лучшие уроки по JS что я встречал! спасибо за ваш труд и конечно большой лайк!
@_Fantom_.
@_Fantom_. 5 лет назад
Спасибо за очень интересный и познавательный урок! Ваши неспешные и наглядные объяснения, делают урок очень понятным для всех..
@Алексей-п9л6н
@Алексей-п9л6н 5 лет назад
Просто суперски!!! 7 строк кода, решен вопрос смены текста в кнопках при клике!!! Александр, Вы - лучший!!! Спасибо огромное!!!
@rovnogames8162
@rovnogames8162 7 лет назад
По больше таких преподавателей в универах!! а то дефицит таких людей! спасибо за то что старались сделать эти видео уроки, видно что от души старались!
@itgid
@itgid 7 лет назад
Наши универы не готовы ни финансово ни морально поддерживать инициативы работников. Поверьте 10 лет отпахал в универе преподом. Никому не интересно это.
@rovnogames8162
@rovnogames8162 7 лет назад
Да вот из за этого что в университетах не могут и не хотят нормально все сделать то есть плана обучение нормального, а не так чисто для вида, вот из за этого интерес в студентов попросту исчезает, ну а те кому не интересно то всегда такие люди есть, только последним временем многовато таких.....................................вот и приходиться те кому действительно это интересно сидеть самому все учить, только получаеться так что ты учишь то что нужно, а сам универ получаеться трата времени.
@evgeniyacherevko6633
@evgeniyacherevko6633 6 лет назад
есть страны, где чхали на дипломы
@ВиталикПилипчук-й6ц
Ваши уроки настоящая находка! Очень доходчиво, хорошая подача. Спасибо большое!!!
@ЛучшеесГорой
@ЛучшеесГорой 7 лет назад
Просто Класс ! Каждый урок заслуживает лайка
@famousanonymous5962
@famousanonymous5962 7 лет назад
Одни из лучших уроков JS на youtube (если не лучшие). Очень все наглядно, содержательно и с пояснениями, что и как работает, чего так обычно не хватает в других туториалах. Спасибо, автор
@malygos1898
@malygos1898 6 лет назад
Вот этот интересный урок, в том плане что открывает внутреннюю структуру элементов. Теперь понятно откуда взялся innerHTML :)
@itgid
@itgid 6 лет назад
Спасибо, старался.
@2tanhamon-gameblog480
@2tanhamon-gameblog480 6 лет назад
Спасибо огромное за уроки ! Самые лучшие по JS !
@itgid
@itgid 6 лет назад
Спасибо!
@nikitaskin6511
@nikitaskin6511 3 года назад
спустя 4 года вашим урокам всё ещё нет аналога)) благодарю за полезные видео!
@MamontovO
@MamontovO 6 лет назад
Спасибо за урок. Как всегда всё ОЧЕНЬ понятно и доступно объясняете. Удачи.
@itgid
@itgid 6 лет назад
Спасибо!
@ichelsea
@ichelsea 4 года назад
Спасибо вам за подробное объяснение.
@ДаниилЧернавин-ь1о
Удивительно понятные уроки ! Спасибо вам большое !
@GrourDenis
@GrourDenis 6 лет назад
огромная благодарность автору!
@itgid
@itgid 6 лет назад
Спасибо! Приятно!
@Александр-ц4т8в
@Александр-ц4т8в 6 лет назад
Супер урок.
@itgid
@itgid 6 лет назад
Спасибо!
@МакарПлотников
@МакарПлотников 6 лет назад
Спасибо вам большое, мне очень интересно и на каждом уроке я узнаю что-то новое!
@reptile8675
@reptile8675 5 лет назад
6:00 Чаёк)
@itgid
@itgid 5 лет назад
увы, за годы преподавания голос - больное место, 20 минут говорю и садится полностью, из-за этого курсы и бросил.
@Видево-я5п
@Видево-я5п 5 лет назад
Отличный урок
@GMorganKIEV
@GMorganKIEV 7 лет назад
очень доходчиво. Все понятно. Спасибо
@ichwill421
@ichwill421 6 лет назад
Спасибо! Большое! Огромное! Все понятно. По ссылкам на скачивание подвязаны файлы не с этого урока. По остальным урокам не проверял.
@spoonjeee4785
@spoonjeee4785 6 лет назад
очередное огромное спасибо!)
@itgid
@itgid 6 лет назад
Спасибо!
@lezgin1823
@lezgin1823 6 лет назад
реально все отлично!!! очень нравится, как Вы объясняете.!!! спасибо!!!!!!!!!!!!!!! с удовольствием бы брал у Вас уроки, если не дорого))) есть такая возможность?
@stoyariko
@stoyariko 5 лет назад
спасибо, очень доходчиво!
@pavelsamsonenka3155
@pavelsamsonenka3155 5 лет назад
Супер! Спасибо :D
@TheElvis1980
@TheElvis1980 4 года назад
Забыл прописать defer, не мог понять почему не работает! ))) 7:20
@vip51000
@vip51000 3 года назад
defer гарантирует что с начало будет загружаться DOM, и только после этого будут загружаться скрипты и выполнятся последовательно в порядке следования
@Synchro13
@Synchro13 5 лет назад
Вы самый лучший !! )
@evgeniyprowork
@evgeniyprowork 6 лет назад
в JS бывает что из за одной ошибки не работает весь код, как я понял для этих целей есть тесты, вероятно что то вроде mocha, я не знаю насколько оно отличается от встроенного дебаггера в браузер и вообще для каких целей, если все таки это нужная вещь, запилите пожалуйста видео на эту тему, у вас лучше всех получается преподнести материал, если в планах такого не предвидится , то посоветуйте в какую сторону смотреть, если вообще это нужно для frontend
@itgid
@itgid 6 лет назад
Постараюсь сделать!
@tilekmoldaliev7803
@tilekmoldaliev7803 3 года назад
А почему событие onclick второй раз для функции f2 не работает,это событие отмечена в коде как просто строка
@amateurclips7370
@amateurclips7370 6 лет назад
огонь) спасибо
@Vikosha123
@Vikosha123 5 лет назад
Добрый день! Спасибо большое за урок! Хотелось бы поинтересоваться: а почему при повторном клике на элементы с классом, не срабатывает функция со сменой фона? Ведь элементы с классом one попадают в массив р.
@_pheax
@_pheax 6 лет назад
спасибо, все ясно.
@texno5440
@texno5440 6 лет назад
а можно тему которую вы используете в сублайм? чтоб сделать такое же оформление рабочей среды
@itgid
@itgid 6 лет назад
github.com/buymeasoda/soda-theme
@victorkas2279
@victorkas2279 6 лет назад
Какой плагин выделяет цвет pink?
@alexeybakushev1932
@alexeybakushev1932 5 лет назад
Доброе утро! Помогите разобраться, пожалуйста. Не могу понять отчего не работает следующий код: var p = document.getElementsByTagName('p'); console.log(p); for (let i = 0; i < p.length; i++) { p[i].onclick = f1; } function f1() { alert("Hello!"); } Ошибок не выдает, но и при клике на параграфы не работает. Проверял в Опере и Гугл Хром. Так же не работает код: var p = document.getElementsByTagName('p'); console.log(p); p[0].onclick = f1; function f1() { alert("Hello!"); } Но выдает ошибку: main.js:18 Uncaught TypeError: Cannot set property 'onclick' of undefined at и подчеркивает участок onclick = f1; Кстати, а почему у Вас в видео f1 используется без () в строке p[0].onclick = f1; ???
@pandaskeptic2937
@pandaskeptic2937 5 лет назад
помоему этот код устарел. у меня тоже не работает
@pandaskeptic2937
@pandaskeptic2937 5 лет назад
Сделай вот так: var p = document.getElementsByTagName("p"); window.onload = function(){ for (var i = 0; i
@АхмедК-т7е
@АхмедК-т7е 5 лет назад
Alexey Bakushev у меня тоже не работает!
@АхмедК-т7е
@АхмедК-т7е 5 лет назад
спасибо мужик помог!
@ДаниилЧернавин-ь1о
У меня оба твои кода работают.
@smartclever6646
@smartclever6646 7 лет назад
Подскажите, где набивать руку практикой. Может существует какой нибудь задачник по JS начиная с самых азов? Спасибо!!!
@webdev5107
@webdev5107 6 лет назад
что ни будь нашли? а то уже год туда-сюда гоняю этот js. уроки посмотрю - вроде всё знаю. а практики нет и через мес-два опять ничего не знаю и уроки смотреть) если нашли можете поделиться?)
@reeltwodialogtracktwo7666
@reeltwodialogtracktwo7666 6 лет назад
Девид Флиган - "JavaScript. Подробное руководство" Там и теория и практика, и много ещё чего интересного.
@webdev5107
@webdev5107 6 лет назад
ReelTWO DialogtrackTWO, попробую, спасибо.
@ЯрославВлас-б6т
@ЯрославВлас-б6т 5 лет назад
Обясните плиз почему нету скобок () при вызове функции f1 p[i].onclick = f1;
@wepko
@wepko 6 лет назад
Ааа, я понел как работает this , спасибо огромное !!!
@itgid
@itgid 6 лет назад
По мне это очень сложно - наверное самое сложное в JS
@faust2134
@faust2134 5 лет назад
Нет, ты не понял
@faust2134
@faust2134 5 лет назад
@@itgid сложнее чем прототипное наследование? Хз Ты бы лучше об"яснил правильно почему в данном случае this возвращает елемент. Не потому что "this это наш елемент", а потому что this это контекст, а метод мы вызываем в контексте елемента
@taniak6007
@taniak6007 6 лет назад
Почему параграфы 2 и 5 реагируют только на функцию f2 и не реагируют на f1? Ведь f1 же на все параграфы распостраняется.
@itgid
@itgid 6 лет назад
у параграфа есть свойство onclick. Когда мы назначаем f2 мы затерли функцию f1 для данных параграфов.
@taniak6007
@taniak6007 6 лет назад
спасибо за ответ)
@_nurakhmetov.a
@_nurakhmetov.a 5 лет назад
почему то у меня не работает function f1(){ alert('hello'); } var i; i = document.getElementsByTagName('p'); console.log(i); i[0].onclick = f1;
@johhnybee
@johhnybee 6 лет назад
Дякую!
@gurudk3378
@gurudk3378 6 лет назад
Не зрозуміло, чому на параграф 1 і 5 не подіяла функція f1, а тільки f2, хоча f1 розповсюджується на всі .
@ВиталийСлободянюк-х8м
Правильно я поняв что есть конструкция getElementBy, а дальше мы указываем без пробела к чему обращаемся...то есть class/id/tag ?
@marialite6964
@marialite6964 6 лет назад
ЗЫС :)
@АртемАлексеенко-й2ъ
Спасибо большое за понятные уроки! Скажите пожалуйста, почему не получается использовать в цикле "механизм" (не знаю как это назвать) for... of: for (let i of p) { p[i].onclick = f1; }
@itgid
@itgid 6 лет назад
Синтаксис правильный, выложите весь код на codepen. помогу
@АртемАлексеенко-й2ъ
Спасибо за желание помочь. Вот ссылка: codepen.io/SaggyA/pen/VjjpWZ Консоль при обработке for... of выдает такую ошибку: "Uncaught TypeError: Cannot set property 'onclick' of undefined". И при этом не выполняется даже f2, цикл которой задан "классическим" способом"
@itgid
@itgid 6 лет назад
codepen.io/luschenko/pen/JLEVxj?editors=1111 Смотрите, ошибка в том, что в данном цикле переменная i - не счетчик, а сам объект. Т.е. вы должны не p[i].onclick, а i.onclick писать. Тогда все работает. И лучше ее не i - называть, это сбивает с толку, а как-то типа singleElem
@АртемАлексеенко-й2ъ
Спасибо большое за ответ! А почему не работала функция f2()? Скрипт "спотыкался" на ошибке и дальше не шел?
@itgid
@itgid 6 лет назад
Да, javascript в этом очень хитрый. Ошибка в одном скрипте а не работают везде.
@victorkas2279
@victorkas2279 6 лет назад
Почему такая функция не работает? for( i = 0; i < p.length; i++){ p[i].onclick = f1; } function f1(){ console.log('work') p[i].style.background = 'hsl(0, 50%, 50%)'; } не меняет цвет бэкграунда?
@itgid
@itgid 6 лет назад
напишите вместо p[i].style.background this.style.background - заработает. Внутри функция не знает что такое p[i]
@victorkas2279
@victorkas2279 6 лет назад
Благодарю!
@shatikshatik6496
@shatikshatik6496 6 лет назад
тоже как самое первое решение написал внутри функции p[i]. Но все же не совсем понял почему функция не знает p[i]. Ей же переменная i передается.
@TigraDP
@TigraDP 6 лет назад
Наоборот, переменной p[i] передается функция f1. А так как в данном случае p[i] не глобальная переменная, то f1 про нее ничего не знает.
@ОлегШумовський-л9я
Дуже цікаво, коли написав ось так: var p = document.getElementsByTagName('p'); console.log(p); p.onclick = f1(); function f1() { alert('Hello'); }; То все відпрацювало, але коли додаю індекс масива то при нажатті по ньому він не відпрацьовує. Але якщо написати ось так p[0].onclick = f1; то при нажатті все працює.
@shatikshatik6496
@shatikshatik6496 6 лет назад
Почему не срабатывает функция pink внутри функции f1? function f1() { pink(); } function pink() { this.style.background = 'pink'; }
@TigraDP
@TigraDP 6 лет назад
Потому что вы не пояснили, что такое pink(). function f1() { function pink(); } Думаю надо так.
@zhl8412
@zhl8412 7 лет назад
а что, разве 3:01 третья строка- разве не надо скобок после f1?
@itgid
@itgid 7 лет назад
скобки ставите там, где хотите чтобы функция выполнилась
@sinaktenone9882
@sinaktenone9882 7 лет назад
не работает функция, в инструментах пишет Uncaught SyntaxError: Unexpected identifier, в чем может быть причина? var p = document.getElementsByTagName('p'); console.log(p); p[0].onclick = f1; Function f1 (){ alert('hello'); }
@itgid
@itgid 7 лет назад
не может получить элементы со страницы.
@sinaktenone9882
@sinaktenone9882 7 лет назад
а чем может быть причина, все подключено, алерт выводит коллекцию, припопытке выведения любого элемента массива пишет андефайнд, var p = document.getElementsByTagName('p'); console.log(p); alert(p[0]);
@itgid
@itgid 7 лет назад
Скиньте код в codepen и пришлите ссылку.
@sinaktenone9882
@sinaktenone9882 7 лет назад
codepen.io/anon/pen/EXoKgK в кодпене все работает, а в браузере нет, не могу понять, в любом случае спс)
@itgid
@itgid 7 лет назад
Просто подключите скрипт указанной строкой. Либо перенесите ваше подключение в самый низ, перед закрывающимся тегом body.
@viacheslavgava3430
@viacheslavgava3430 5 лет назад
1000 👍 против 1 👎. Александр, вас даже хэйтеры любят)
@ВиталийСлободянюк-х8м
То есть мы сегодня работали как всегда смысле с id и DOM только без него смысле с тегом и DOM?)
@ИяИя-п2к
@ИяИя-п2к 5 лет назад
Так интересно, кто же ставит дизлайки?
@BillGates-ry3dk
@BillGates-ry3dk 5 лет назад
Зысь)))) Дыс
@timyrfilatov4315
@timyrfilatov4315 5 лет назад
Как перебрать элементы, проверяя length их текстового содержимого? Допустим в html прописано следующее 1111111111111111111111 ldksfj 33333333333333333333333333 ldksfj как мне в java skript перебрать элементы, проверяя length их текстового содержимое. Где текста больше ссылка должна о ставиться, где меньше удалится?. Мне просто завтра уже надо показывать скрипт времени уже почти не осталось. А иначе практику не засчитают. На вас последняя надежда. Уже нет времени обучатся.
@pavelladan3887
@pavelladan3887 7 лет назад
тут как-то не понятно что значит 'work'
@NightWooooolf
@NightWooooolf 7 лет назад
если думать логически, то в переводе на русский означает сработало. вы можете написать вместо слова "work" хоть слово " Яичко" , оно все равно будет работать. считайте это слово некой переменной)
@igortagintsev2737
@igortagintsev2737 7 лет назад
Что-то не работает :(
@NightWooooolf
@NightWooooolf 7 лет назад
скорей всего вы уже поняли проблему, но а если нет, два варианта ( с этой проблемой и я сталкивался свое время) 1) автор подключает js код отдельным файлом, а вы в файле html подключаете джава скрипт без команды defer . или же просто подключите данный код перед закрывающим тегом body 2) опечатка в коде.
@oleeynaa
@oleeynaa Год назад
@@NightWooooolfДякую!! спрацювало!!
@pavelkovalenko7752
@pavelkovalenko7752 5 лет назад
спустя два года на видео 1 дизлайк????
@itgid
@itgid 5 лет назад
Pavel Kovalenko я красавчик
Далее
DEMONS ARE ATTACKING BRAWL STARS!!!
09:08
Просмотров 15 млн
Учим Java Script 12. Создаем слайдер
19:50
DEMONS ARE ATTACKING BRAWL STARS!!!
09:08
Просмотров 15 млн