JavaScript и Django

Python
#21

Просто была не закрыта фигурная скобка.
Почему-то js не рабочий, то есть через функцию тегу <i> должно присваиваться onclick=f(this) (это работает), но почему-то не происходит передача id, id присваивается так:

btnImg.setAttribute('id_1', id);

тег <i> становится таким:

<i class="fas fa-play" height="40" width="40" id="p-img-0" id_1="1" onclick='f(this)' aria-hidden="true"></i>

Но в функцию вывода id_1 почему то не передается:

function f(el){
alert(el.id_1);
}

onclick=f(this) присваивается так:

btnImg.setAttribute("onclick", 'f(this)');
#22

не знаю работает ли так, но тут можно сразу без HTML

btnImg.onClick = ...

или еще лучше

#23

Просто у нас есть <div>, который должен заполняться, но если посмотреть исходный код там ничего не будет, а в коде элемента будет. То есть изначально у нас нет этого объекта и что-то присваивать надо в btnImg.setAttribute.
Или можно тег <i> инициализировать по классу?

#24

Не понял о чем это, но нет смысла использовать

В JS можно сразу у этого объекта

#25

Ну так эта функция используется только для заполнения как я понял

function createTrackItem(index,name,duration, id){
   var btnImg = document.createElement('i');
    btnImg.setAttribute("class", "fas fa-play");
    btnImg.setAttribute("height", "40");
    btnImg.setAttribute("width", "40");
    btnImg.setAttribute("id", "p-img-"+index);
    btnImg.setAttribute('id_1', id);
    btnImg.setAttribute("onclick", 'f(this)');
    document.querySelector("#pbp-"+index).appendChild(btnImg);
}
#26

Какая? :thinking:

this точно не будет работать в атрибуте HTML.

const self = this
btnImg.onclick = () => f(self)
#27

эта:

function createTrackItem(index,name,duration, id){
   var btnImg = document.createElement('i');
    btnImg.setAttribute("class", "fas fa-play");
    btnImg.setAttribute("height", "40");
    btnImg.setAttribute("width", "40");
    btnImg.setAttribute("id", "p-img-"+index);
    btnImg.setAttribute('id_1', id);
    btnImg.setAttribute("onclick", 'f(this)');
    document.querySelector("#pbp-"+index).appendChild(btnImg);
}
#28

Так и что мешает тут сразу установить onclick или вызвать addEventListener не записывая это в атрибут HTML?

#29

Если мы сделаем так, то это исполнится сразу, так как функция отвечает только за создание объекта, а надо получить id только при нажатии

#30

Так onclick это и есть обработчик клика, почему он сразу исполнится?

#31

Это функция получается?

#32

Это вызов функции внутри обработчика onclick.

#33

И получается чтобы вывести id нам надо внутри функции прописать alert(self.id_1);?

#34

Element.getAttribute() - Web APIs | MDN

И для своих не стандартных атрибутов лучше добавлять data-.

data-myId="42"

Using data attributes - Learn web development | MDN