Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/393.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 我需要使用fetch为数组中的每个图像向DOM添加图像元素_Javascript_Image_Api_Fetch - Fatal编程技术网

Javascript 我需要使用fetch为数组中的每个图像向DOM添加图像元素

Javascript 我需要使用fetch为数组中的每个图像向DOM添加图像元素,javascript,image,api,fetch,Javascript,Image,Api,Fetch,添加JavaScript: 在页面加载时,使用上面的url获取图像, ,将响应解析为JSON ,将数组中每个图像的图像元素添加到DOM中代码中几乎没有错误 它应该resp.json()而不是resp.json 然后需要在传入数据images.message.forEach()中的message属性上循环 设置img.src非img.innerHTML 函数ceo(){ 常量imgUrl=”https://dog.ceo/api/breeds/image/random/4" 获取(imgU

添加JavaScript:

在页面加载时,使用上面的url获取图像, ,将响应解析为JSON
,将数组中每个图像的图像元素添加到DOM中

代码中几乎没有错误

  • 它应该
    resp.json()
    而不是
    resp.json

  • 然后需要在传入数据
    images.message.forEach()中的
    message
    属性上循环

  • 设置
    img.src
    img.innerHTML

  • 函数ceo(){
    常量imgUrl=”https://dog.ceo/api/breeds/image/random/4"
    获取(imgUrl)
    .then(resp=>resp.json())
    .then(json=>renderImg(json))
    }
    //需要概念方面的帮助
    函数渲染(图像){
    const loc=document.querySelector('div')
    images.message.forEach(Image=>{
    const img=document.createElement('img');
    img.src=图像;
    附件儿童(img)位置
    });
    }
    document.addEventListener('DOMContentLoaded',()=>{
    首席执行官()
    })

    但问题是什么?另外
    resp=>resp.json()
    非常感谢much@feli当一个答案解决了你的问题,你可以考虑投票和/或标记它被接受,以表明问题得到解决:
    function ceo() {
        const imgUrl = "https://dog.ceo/api/breeds/image/random/4" 
        fetch(imgUrl)
        .then(resp => resp.json)
        .then(json => renderImg(json))
    
    }
    // needed help with concepts 
    function renderImg(images) {
        const loc = document.querySelector('div')
        images.(Image => {
            const img = document.createElement('img');
            img.innerHTML = Image.message;
           loc.appendChild(img)
        });
    }
    
    
    
    document.addEventListener('DOMContentLoaded', () => {
        ceo()
    })