入力された文字が表示されない　ｊｓ

エラーが何も出ていないのに入力された文字が表示されないのはどうしてでしょうか？
ご教授いただければ幸いです。

javascript
1コードlet button = document.querySelector('.btn');
2button.addEventListener('click',function(){
3	let input = document.querySelector('.input');
4	input.value =='';
5	if (input.value=='' ) {
6	let stop_list = document.querySelector('.stop-list');
7	let li_stop = document.createElement('li');
8	li_stop.classList.add('list');
9	li_stop.textContent = input;
10	console.log(li_stop);
11	let div_delete = document.createElement('div');
12	div_delete.classList.add('delete')
13	div_delete = 'Delete';
14	div_delete.addEventListener('click',function(){
15		let hantei = confirm ('本当に削除しますか？');
16		this.parentElement.remove();
17
18
19li_stop.appendChild(div_delete);
20  stop_list.appendChild(li);
21  document.querySelector('.input').value='';
22
23  	})
24	}
25})

html
1コード<body>
2  <header>
3  <h1 class="title">STOP DOING LIST</h1>
4   <form>
5   	<input class="input" type="text" placeholder="Add your list here" >
6　　 <input type="button" class="btn" value="Add">
7   </form>
8             <script src='todo.js'></script>
9  </header>
10
11</body>

m.ts10806

2020/10/30 01:35

実際のコード以外は入れないでください。コピペだとエラーが出ます。＜コード

行動規範の内容に同意します

回答2件

if (input.value=='' ) {

なのでinputの値が空のときにしか実行されるものがないように見えます。
またifの中もstop-listクラスが見当たりません

投稿2020/10/30 01:42

yambejp

総合スコア116724

ShinKoba

2020/10/30 14:16

ご指摘ありがとうございます。 if(input.value !='')に修正したら表示できるようになりました。

行動規範の内容に同意します

ベストアンサー

コードインデントはちゃんと整えられたほうが良いかと思います。

js
1let button = document.querySelector('.btn');
2button.addEventListener('click', function() {
3	let input = document.querySelector('.input');
4	input.value == '';
5	if (input.value == '') {
6		let stop_list = document.querySelector('.stop-list');
7		let li_stop = document.createElement('li');
8		li_stop.classList.add('list');
9		li_stop.textContent = input;
10		console.log(li_stop);
11		let div_delete = document.createElement('div');
12		div_delete.classList.add('delete')
13		div_delete = 'Delete';
14		div_delete.addEventListener('click', function() {
15			let hantei = confirm('本当に削除しますか？');
16			this.parentElement.remove();
17			li_stop.appendChild(div_delete);
18			stop_list.appendChild(li);
19			document.querySelector('.input').value = '';
20
21		})
22	}
23})

そのうえで

 let input = document.querySelector('.input');
input.value == '';    //これは代入じゃなくて評価式になってるけど大丈夫？


 let div_delete = document.createElement('div');
div_delete.classList.add('delete')
div_delete = 'Delete';
div_delete.addEventListener('click', function() {    //要素作っただけで画面上にない要素にイベントAddしようとしてるけどそれで大丈夫？

投稿2020/10/30 01:39

編集2020/10/30 01:41

m.ts10806

総合スコア80875