41 Востаннє редагувалося 221VOLT (03.04.2020 19:56:51)

Re: події та обробники

маленький несуттєвий нюанс --
програміст старається писати менше коду, а не більше :)

навіщо писати

<script type="text/javascript">
  ...
</script>

якщо можна писати

<script>
  ...
</script>

?

надворі 2020й рік, та стандарт html5 :)
html5 для скриптів не вимагає писати type="..
досить писати html4/xhtml :)

це ж самісіньке і про DOCTYPE :)

42

Re: події та обробники

koala написав:

Значення поля можна отримати так:

document.getElementById("data").value

для сучасних браузерів ще можна написати

data.value
Подякували: koala1

43

Re: події та обробники

ExPy написав:

harentius, на це є багато причин.

Прихований текст

Деколи iнфи банально нема на рос./укр. мовi. Я знаю аксiому, що "справжнiй погроммiст мусить знати iнглiш!!!!", але реальнiсть трохи iнакша. Ну i в вiдеокурсi часто все розжовано i структуризовано.
Тай не вебом єдиним..по реверсу/системному програмуваннi курси багато кому допомогли, там все складнiше чим console.log..

Прихований текст

можна було і не купувати :)

Прихований текст

44

Re: події та обробники

elektryk написав:

Придбав відеоуроки по JavaScript Михайла Русакова, а вони виявились наскрізь москальські. Таке враження, що він тупо читає довідник, а не підручник!!
Тож я не можу зробити єлементарну вправу:
1 При наведенні курсора на зображення розмір width має стати 500 (а був 100);
2 при сході курсора з зображення, воно повинне повернутись до початкового розміру.
З першою частиною я впорався без проблем:

function halterMouseOver(img){
    img.width = '500';
}
<img src='01.jpg' width='100' onmouseover="halterMouseOver(this)"/>

Аналогічно зробив і другу частину.

function halterMouseOut(img){
    img.width = '100';
}
<img src='01.jpg' width='100' onmouseout="halterMouseOut(this)"/>

Але з'ясувалося, що виникло два зображення. Одна функція працює з одним, а друга з іншим.
То як зарадити моєму горю??

справді, несподіванка -- купувати курс у хлопця з Росії,
та дивуватись на російське  :) ото ви любите пожартувати

а по темі, буквально по назві теми --
імхо вам варто ознайомитись з

Прихований текст

https://learn.javascript.ru/introduction-browser-events
і зверніть увагу на addEventListener

45 Востаннє редагувалося ExPy (03.04.2020 20:09:21)

Re: події та обробники

Можна написати щось

<input type="date" id="d">
...
let d = document.getElementById("d");
d.valueAsDate.getTime();

буде час в секундах..

Подякували: harentius, 221VOLT2

46 Востаннє редагувалося elektryk (03.04.2020 20:40:36)

Re: події та обробники

harentius написав:

Мені здається, що це трохи безсмисленно. Якщо автор з цим не може впоратися, то йому не потрібно зараз це завдання робити. Це не його.
Тут з двох одне: або учить основи, поки не зрозуміє, або просто чимось іншим займатися. Все. (Ну не повинно таке завдання займати кілька місяців на вирішення. Тут не тільки знання людини, а ще й підходи. Не знайшов рішення в одному місці, значить повинен на стіну лізти шукати в іншому. І знайти.) Не знаю, можна попробувати https://www.w3schools.com/js/. Там є приклади, які можна попробувати, і там найперший приклад якраз схожий (але не на 100%) на те, що автор намагається зробити. Може основи програмування повчити. Може основи html. Але десь є серйозний пробіл. Його потрібно виявити і закрити.

Прихований текст

Мене взагалі завжди дивувало, як (і навіщо!) люди купляють якісь сумнівні курси, з якими потім довго і безсмисленно мучаться, якщо все необхідне є у відкритому доступі, і ще й, як правило, краще (w3schools точно краще, ніж "відеоуроки по JavaScript Михайла Русакова"). Звісно, бувають корисні і рідкісні речі, які варто купити на тому ж юдемі чи курсері, але то вже зовсім інше питання, і зовсім інший рівень.

З усіма зауваженнями згоден.
Ну, не продвинутий я. Не знаю я всіх джелел інфармації.

Що ж до того, навіщо мені на старість цим займатися??
Навіть не знаю, що сказати... Немає в мене пом'якшуючих обставин.

47

Re: події та обробники

Прихований текст

можна було і не купувати

В мене на такі ресурси алергія, тому і не рекомендую ;) Але думаю ви самі знаєте як воно) Ну не пам'ятаю я, як я це все вивчив) Тому рекомендую людям те, що мені здається адекватним) Щодо самої англійської, як мені слушно хтось казав...

Я знаю аксiому, що "справжнiй погроммiст мусить знати iнглiш!!!!"

Ну знаєте, там на сайті перекладач є (справа вгорі)... Та й у Хромі самому можна клацнути правою кнопкою і там є "Translate" .... і перекладайте на свій язьік скільки влізе. Я пішов по класичних джерелах, і моя суб'єктивна думка, що починати завжди треба з них.

З усіма зауваженнями згоден.
Ну, не продвинутий я. Не знаю я всіх джелел інфармації.

В чому тоді проблема? На виправдовуйтеся, виконуйте... Від виправдань ні мені, ні вам користі не буде.

Що ж до того, навіщо мені на старість цим займатися??

Ну у вас повинна бути причина і мотивація, інакше ви б не починали... Розумієте, ваші запитання такі, що я (може тому що ще мало з вами спілкувався) не можу оцінити ваш рівень, і для чого ви цим пробуєте займатися. А ви якось не пробуєте допомогти в цьому розібратися.
Щоб мій меседж хоч якийсь мав смисл, я просто приведу вам приклад коду, що вам треба було зробити

  const userInputDate = new Date(document.getElementById("date").value);
  const nowDate = Date.now();  
  const diffInSeconds = (nowDate - userInputDate) / 60000;
  console.log(diffInSeconds);

Попробувать тут: https://jsfiddle.net/bytmh7c4/1/
Запитання:
1) Що вам було незрозуміло?
2) Що кожен із 4 рядків робить?
3) Як можна було б по іншому записати

document.getElementById("date")

?

Подякували: ExPy1

48

Re: події та обробники

Перепрошую, я помилився трохи, різниця ж в мілісекундах, я сперся на своє старе повідомлення)) Нема мені прощення ))
Тож:

  const userInputDate = new Date(document.getElementById("date").value);
  const nowDate = Date.now();  
  const diffInSeconds = (nowDate - userInputDate) / 1000;
  console.log(diffInSeconds);

https://jsfiddle.net/bytmh7c4/2/

Старі запитання в силі)

Подякували: 221VOLT1

49 Востаннє редагувалося elektryk (04.04.2020 00:07:43)

Re: події та обробники

harentius написав:

Перепрошую, я помилився трохи, різниця ж в мілісекундах, я сперся на своє старе повідомлення)) Нема мені прощення ))
Тож:

  const userInputDate = new Date(document.getElementById("date").value);
  const nowDate = Date.now();  
  const diffInSeconds = (nowDate - userInputDate) / 1000;
  console.log(diffInSeconds);

https://jsfiddle.net/bytmh7c4/2/

Старі запитання в силі)

А перший рядок можна розбити на декілька??
наприклад:
1.1 створення об'єкту;
1.2 зчитування значення;
1.3 присвоювання значення об'єкту.

Зрозуміло начеб-то все. Але сам би ніколи в житті не догадався.

І ще я не люблю const. Чому не var??

50

Re: події та обробники

ExPy написав:

Можна написати щось

<input type="date" id="d">
...
let d = document.getElementById("d");
d.valueAsDate.getTime();

буде час в секундах..

В рядку

let d = document.getElementById("d");

хіба не треба добавляти .value??
Щоб отримати

let d = document.getElementById("d").value;

51

Re: події та обробники

harentius написав:

Старі запитання в силі)

Achtung!! Код не працює

<input type="date" id="date"><br>
<script type="text/javascript">
const userInputDate = new Date(document.getElementById("date").value);
  const nowDate = Date.now();  
  const diffInSeconds = (nowDate - userInputDate) / 1000;
console.log(diffInSeconds);
  alert(diffInSeconds);
</script>

Видає NaN
[Violation] Forced reflow while executing JavaScript took 163ms

52

Re: події та обробники

elektryk написав:

І ще я не люблю const. Чому не var??

Поки код маленький і ви можете його повністю тримати в голові, var виглядає зручнішим: хочу - зміню, не хочу - не зміню.
Коли код займає кілька файлів і ви над ним працюєте більше ніж тиждень, var може перетворити ваше життя на пекло: код щойно працював - а тепер усе шкереберть, бо десь в іншому місці щось змінюється, а ви цього не пам'ятаєте. const гарантує, що значення буде постійним.

elektryk написав:

А перший рядок можна розбити на декілька??

elektryk написав:

Видає NaN

https://codepen.io/fkoala/pen/yLNWZjN

Подякували: 221VOLT, leofun012

53

Re: події та обробники

elektryk написав:

А перший рядок можна розбити на декілька??
...
І ще я не люблю const. Чому не var??

а навіщо розбивати?

var -- то давніший стандарт, означає просто "змінна"
const та let -- то новіший стандарт, означає "константа" та "змінна" відповідно

Подякували: leofun011

54

Re: події та обробники

221VOLT написав:
elektryk написав:

А перший рядок можна розбити на декілька??
...
І ще я не люблю const. Чому не var??

а навіщо розбивати?

var -- то давніший стандарт, означає просто "змінна"
const та let -- то новіший стандарт, означає "константа" та "змінна" відповідно

Я це знаю.
А розбивати на элементарні цеглини для новачків тобто для чайників потрібно, щоб вони знали ті цеглини.
Бо так і будуть програмувати блоками. А якщо потрібно трішки змінити блок, вони не зможуть, бо сприймають блок як елементарну цеглину.

55

Re: події та обробники

elektryk написав:
ExPy написав:

Можна написати щось

<input type="date" id="d">
...
let d = document.getElementById("d");
d.valueAsDate.getTime();

буде час в секундах..

В рядку

let d = document.getElementById("d");

хіба не треба добавляти .value??
Щоб отримати

let d = document.getElementById("d").value;

там вже є valueAsDate , навіщо value ?

Подякували: koala, leofun012

56

Re: події та обробники

elektryk написав:
221VOLT написав:
elektryk написав:

А перший рядок можна розбити на декілька??
...
І ще я не люблю const. Чому не var??

а навіщо розбивати?

var -- то давніший стандарт, означає просто "змінна"
const та let -- то новіший стандарт, означає "константа" та "змінна" відповідно

Я це знаю.
А розбивати на элементарні цеглини для новачків тобто для чайників потрібно, щоб вони знали ті цеглини.
Бо так і будуть програмувати блоками. А якщо потрібно трішки змінити блок, вони не зможуть, бо сприймають блок як елементарну цеглину.

const userInputDate = new Date(document.getElementById("date").value);

===

const v1 = document.getElementById("date").value;
const userInputDate = new Date(v1);

можна і більше розписати

const v0 = document.getElementById("date");
const v1 = v0.value;
const userInputDate = new Date(v1);

57

Re: події та обробники

Ой спасибі!!

А ще я з'ясував, що ввід числа в поле є пріорітетним.
До цього я думав, що навпаки...

58

Re: події та обробники

elektryk написав:

А ще я з'ясував, що ввід числа в поле є пріорітетним.

*DONT_KNOW* тепер я загубився...
що означає "ввід числа в поле є пріоритетним" ?

Подякували: leofun011

59

Re: події та обробники

221VOLT написав:
elektryk написав:

А ще я з'ясував, що ввід числа в поле є пріорітетним.

*DONT_KNOW* тепер я загубився...
що означає "ввід числа в поле є пріоритетним" ?

Ну, це просто. Ось код.

<input type="date" id="date" value ="2020-04-04">

В ньому вже задана одна дата "2020-04-04".
Але коли ми вводимо в поле іншу дату, то інша має приоритет.

60

Re: події та обробники

Ви щось неправильно зрозуміли. Код

<input type="date" id="date" value ="2020-04-04">

Означає, що на момент завантаження сторінки в цьому полі буде значення 2020-04-04. Але, очевидно, ми можемо це значення змінити, і тоді там буде інше значення. Ви ж не вважаєте, що при зміні значення змінної нове значення є "пріоритетним"?

Подякували: leofun01, 221VOLT2