我正在学习 javascript，现在我陷入了一个小项目。我收到一个错误:
“ Uncaught ReferenceError :前缀操作中左侧表达式无效 在 HTMLImageElement 处。 (app.js:142)"
我不知道错误在哪里。我将在下面发布代码，也许有人会给我答案。提前致谢。
$(function () {
const model = {
cats: [
{
name: 'Suzie',
src: 'src="img/Suzi.jpg"',
counter: 0
},
{
name: 'Cici',
src: 'src="img/Cici.jpg"',
counter: 0
},
{
name: 'Pufosenie',
src: 'src="img/Pufosenie.jpg"',
counter: 0
},
{
name: 'Ariciul',
src: 'src="img/Ariciul.jpg"',
counter: 0
},
{
name: 'Iri',
src: 'src="img/Iri.jpg"',
counter: 0
}
]
};
const octupus = {
getCatsArrayLength: function () {
return model.cats.length;
},
getCatsName: function(number){
return model.cats[number].name;
},
getCatsSrc: function(number){
return model.cats[number].src;
},
getCatsCounter: function(number){
return model.cats[number].counter;
},
generateListOfCats: function (arrayOfCats) {
viewList.renderList();
},
generateCatPicture: function () {
viewCatPicture.renderPicture();
},
};
const viewList = {
renderList: function () {
const ul = document.querySelector('.cat-list');
for (let i = 0; i < octupus.getCatsArrayLength(); i++) {
const catLi = `<li class="catName"><h3 class="h3Cat">${octupus.getCatsName(i)}</h3></li>`;
ul.insertAdjacentHTML('beforeend', catLi);
}
}
};
const viewCatPicture = {
renderPicture: function () {
for (let i = 0; i < octupus.getCatsArrayLength(); i++) {
const h3CatName = document.querySelectorAll('.catName .h3Cat');
h3CatName[i].addEventListener('click', function (e) {
const displayArea = document.querySelector('.display-area');
const imageToBeInserted =
`<div class="Cat">
<h3 class="h3Cat">${octupus.getCatsName(i)}</h3>
<img class="catImg" alt="image of a kitten" ${octupus.getCatsSrc(i)}">
<ul class="click-list">
<li id="counter"><h3 class="h3Cat">${octupus.getCatsCounter(i)}</h3></li>
<li><h3 class="h3Cat">clicks</h3></li>
</ul>
</div>`;
displayArea.innerHTML = imageToBeInserted;
const imgSelected = document.querySelector('.catImg');
imgSelected.addEventListener('click', function () {
const counterSelect = document.getElementById('counter');
counterSelect.innerHTML = `<h3 class="h3Cat">${++octupus.getCatsCounter(i)}</h3>`;
});
});
}
},
startCatPicture: function () {
this.renderPicture();
}
};
octupus.generateListOfCats(model.cats);
octupus.generateCatPicture();
}());
最佳答案
错误在这里:
counterSelect.innerHTML = `<h3 class="h3Cat">${++octupus.getCatsCounter(i)}</h3>`;
只能对变量或对象属性使用自增和自减运算符；可以位于赋值操作左侧的内容。出于同样的原因
someFunction(1, 2) = 5;
没有意义，++octupus.getCatsCounter(i)也没有。如果您希望该函数调用的值加 1，则为
counterSelect.innerHTML = `<h3 class="h3Cat">${1 + octupus.getCatsCounter(i)}</h3>`;
关于javascript - 产生此错误的增量 : Uncaught ReferenceError: Invalid left-hand side expression in prefix operation，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/55282879/