Не удается добавить событие onclick к элементу DOM

Question

Я создаю элемент p внутри div (давайте назовем его «test-div») и хочу добавить к нему события onclick, я могу дать ему класс и идентификатор, но я получаю ошибки при добавлении onclick. Он говорит, что имеет тип void. Мой код в основном это:

var son = document.createElement("p");
var node = document.createTextNode("test");
son.appendChild(node);
var father = document.getElementById("test-div");
father.appendChild(son);
son.className = "son-class";
son.id="son-id";
son.onclick= sonFunction(randomVar); //Type 'void' is not assignable error

Ответ: son.addEventListener ("click", function () {sonFunction (randomVar)});

javascript html dom

0

Ana moreira

Answer 1

На самом деле вы можете использовать атрибут onclick, просто назначьте его с помощью setAttribute следующим образом:

var son = document.createElement("p");
var node = document.createTextNode("test");
son.appendChild(node);
son.className = "son-class";
son.id="son-id";
son.setAttribute('onclick', 'sonFunction()');
var father = document.getElementById("test-div");
father.appendChild(son);

function sonFunction() {
    alert(event.srcElement.id);
}

<div id="test-div">

Answer 2

Вы пытаетесь изменить атрибут onclick , который ожидает строку, и присваиваете ей возвращаемое значение вашей sonFunction , которая не имеет возвращаемого значения, следовательно ( недействительный ) .


Вы можете установить атрибут  onclick  с помощью строки, например:
son.onclick = 'sonFunction(randomVar);';

Это даст вам вывод HTML, похожий на:
<p class="son-class" onclick="sonFunction(randomVar);">
    ...
</p>

Однако вы, вероятно, захотите назначить ему прослушиватель событий, который будет вызывать событие при нажатии. Выполнение ниже не добавит атрибут  onclick  в HTML, но сохранит слушателя в компиляторе Javascript. Это часто называют «ненавязчивым» Javascript, поскольку код Javascript не встроен в HTML.
function sonFunction() {
    // something here
};
son.addEventListener('click', sonFunction);

Или же
son.addEventListener('click', function () {
    // something here
});

Не удается добавить событие onclick к элементу DOM

2 ответа

Новые вопросы

javascript