对象元素内的图像jpg数据

Question

我试图使用<object>元素正确嵌入jpg。

虽然使用<object>和svg数据工作正常，但是当我将jpg文件放入数据时，图像显示不正确。

<section class="sidebar" id="sidebar-left">                          

    <object id="sidebar-img" > sidebar </object>                   

</section>

我在子页面上通过javascript注入图片。

<script>

    $(document).ready(function(){

        $('#sidebar-img').attr('data', './img/tools.jpg'); 
        $('#sidebar-img').attr('type', 'image/jpg');
    });

</script>

jpg <object>处的浏览器也会插入整个html文档树，html＆gt;头＆gt;身体＆gt; [img]（见截图），有svg数据，没有这样的事情？

这个＆＃39; html＆＃39;高度等于jpg高度，但对象有不同？

你知道这是怎么回事吗？ CSS：

.sidebar {

            width: 25%;
            font-size: 120%;
            margin: 0 auto;
            text-align: center;
    }

#sidebar-img {

            max-width: 80%;
            height: auto;
            width: auto;
    }