質問編集履歴
1
文法の修正
title
CHANGED
File without changes
|
body
CHANGED
@@ -107,6 +107,54 @@
|
|
107
107
|
[How to pass created element to another function
|
108
108
|
](https://stackoverflow.com/questions/65124892/how-to-pass-created-element-to-another-function)
|
109
109
|
|
110
|
+
```js
|
111
|
+
//onclickが動かない問題
|
112
|
+
|
113
|
+
function renderTodo(todo) {
|
114
|
+
let list = document.getElementById('todoList');
|
115
|
+
let li = document.createElement('li');
|
116
|
+
li.setAttribute('class', 'todo__item');
|
117
|
+
li.setAttribute('check', todo.checked);
|
118
|
+
li.setAttribute('id', todo.id);
|
119
|
+
li.innerHTML += `
|
120
|
+
${todo.text}
|
121
|
+
<svg class="todo__icon">
|
122
|
+
<use xlink:href="img/sprite.svg#icon-cross"></use>
|
123
|
+
</svg>
|
124
|
+
`;
|
125
|
+
|
126
|
+
document.querySelector('.todo__icon').onclick = function (e) {
|
127
|
+
const parentLi = this.parentElement;
|
128
|
+
parentLi.style.border = 'solid red';
|
129
|
+
}
|
130
|
+
|
131
|
+
list.appendChild(li);
|
132
|
+
}
|
133
|
+
|
134
|
+
//addEventListnerが動かない問題
|
135
|
+
|
136
|
+
function renderTodo(todo) {
|
137
|
+
let list = document.getElementById('todoList');
|
138
|
+
let li = document.createElement('li');
|
139
|
+
li.setAttribute('class', 'todo__item');
|
140
|
+
li.setAttribute('check', todo.checked);
|
141
|
+
li.setAttribute('id', todo.id);
|
142
|
+
li.innerHTML += `
|
143
|
+
${todo.text}
|
144
|
+
<svg class="todo__icon">
|
145
|
+
<use xlink:href="img/sprite.svg#icon-cross"></use>
|
146
|
+
</svg>
|
147
|
+
`;
|
148
|
+
|
149
|
+
document.querySelector('.todo__item svg').addEventListener('click',()=>{
|
150
|
+
const parentLi = this.parentElement;
|
151
|
+
parentLi.style.border = 'solid red';
|
152
|
+
})
|
153
|
+
|
154
|
+
list.appendChild(li);
|
155
|
+
}
|
156
|
+
```
|
157
|
+
|
110
158
|
### 補足情報(FW/ツールのバージョンなど)
|
111
159
|
|
112
160
|
ここにより詳細な情報を記載してください。
|