質問編集履歴
1
javascriptを追加で記載しました。
test
CHANGED
File without changes
|
test
CHANGED
@@ -523,3 +523,53 @@
|
|
523
523
|
非同期処理について調べてみた。
|
524
524
|
|
525
525
|
コールバック関数について調べてみた。
|
526
|
+
|
527
|
+
|
528
|
+
|
529
|
+
```js
|
530
|
+
|
531
|
+
saveBtn.addEventListener('click', function () {
|
532
|
+
|
533
|
+
if (itemInput.value === '') {
|
534
|
+
|
535
|
+
alert('文字を入力してください');
|
536
|
+
|
537
|
+
} else if (itemInput.value.length > 10) {
|
538
|
+
|
539
|
+
alert('文字数を減らしてください');
|
540
|
+
|
541
|
+
} else if (itemInput.value !== '' && itemInput.value.length < 10) {
|
542
|
+
|
543
|
+
// node.classList.add('fadeout');
|
544
|
+
|
545
|
+
// node.remove();
|
546
|
+
|
547
|
+
function removeFadeout(el, speed) {
|
548
|
+
|
549
|
+
const seconds = speed / 1000;
|
550
|
+
|
551
|
+
el.style.transition = 'opacity' + seconds + 's ease';
|
552
|
+
|
553
|
+
|
554
|
+
|
555
|
+
el.style.opacity = 0;
|
556
|
+
|
557
|
+
setTimeout(function () {
|
558
|
+
|
559
|
+
el.parentNode.removeChild(el);
|
560
|
+
|
561
|
+
}, speed);
|
562
|
+
|
563
|
+
}
|
564
|
+
|
565
|
+
|
566
|
+
|
567
|
+
removeFadeout(document.querySelector('#content'), 2000);
|
568
|
+
|
569
|
+
}
|
570
|
+
|
571
|
+
});
|
572
|
+
|
573
|
+
|
574
|
+
|
575
|
+
```
|