问题描述
jp1Warper获取的的值是个空,这个想不通为什么?
然后src="${item1.pic}"也报错说未截取
问题出现的环境背景及自己尝试过哪些方法
相关代码
function renderMarket(list = []) {
const item1 = list[0];
const item2 = list[1];
const jp1Warper = document.querySelector(".rax-view-v2 FloorModule--tmcsModule--27mV5Wq");
let item1Html = `
<div class="rax-view-v2 FloorModule--tmcsContentItem--c31nDTr"><a
href="https://item.taobao.com/item.htm?id=642368100100&scm=1007.12144.81309.73136_0_0&pvid=c81c5f27-cd5f-4e65-8d53-816ede584500&utparam=%7B%22x_hestia_source%22%3A%2273136%22%2C%22x_object_type%22%3A%22item%22%2C%22x_hestia_subsource%22%3A%22default%22%2C%22x_mt%22%3A8%2C%22x_src%22%3A%2273136%22%2C%22x_pos%22%3A1%2C%22wh_pid%22%3A-1%2C%22x_pvid%22%3A%22c81c5f27-cd5f-4e65-8d53-816ede584500%22%2C%22scm%22%3A%221007.12144.81309.73136_0_0%22%2C%22x_object_id%22%3A642368100100%2C%22tpp_buckets%22%3A%222144%230%2381309%230%22%7D"><img
lazyload="true" quality="normal" data-once="true"
src="${item1.pic}"
data-before-current-y="736" data-appeared="false" data-has-appeared="true" data-has-disappeared="true"
style="width: 220px; height: 220px; border-radius: 18px;">
<div class="FloorModule--mask--26Ahf9Q"></div>
<div class="FloorModule--tmcsName--19MBfMf">${item1.itemName}</div>
<span class="rax-text-v2 FloorModule--tmcsPrice--1dbgcpg">¥8.9</span>
</a></div>`
jp1Warper.innerHTML = item1Html + jp1Warper.innerHTML;
}
ajaxPromise({
url: "http://localhost:9000/api/jp1"
}).then((res) => {
console.log(res);
renderMarket(res.data);
})
document.querySelector(".rax-view-v2 FloorModule--tmcsModule--27mV5Wq")
这个 selector 有点问题,FloorModule--tmcsModule--27mV5Wq
没有任何前缀,应该是个 Tag,但显然这不是一个 Tag 的命名,这里应该是.FloorModule--tmcsModule--27mV5Wq
吧,就是 class?"${item1.pic}"
的错误要看res
的结果是啥样,console.log("remote result: ", res.data)
打印出来看看