javascript - innerHTML img Memory Leak

Question

The tcp server continues to forward the new image path.

The client continues to update the image through the path it receives.

I think .innerHTML = "<img makes memory leak

<script src="/socket.io/socket.io.js"></script>

<script type="text/javascript">
    const socket = io();
    socket.on('data', (msg)=>{
        document.getElementById('IMG').innerHTML = "<img src="+msg.imagePath + ">";
    });
</script>

This is my second plan.

How can I keep changing the image without any memory leak?

<script src="/socket.io/socket.io.js"></script>

<script type="text/javascript">
    const socket = io();
    socket.on('data', (msg)=>{
        (function(){
            document.getElementById('IMG').innerHTML = "<img src="+msg.imagePath + ">";
        }());
    });
</script>

标签： javascripthtmlsocket.io

Answer 1

您只能更改src：

document.querySelector('#IMG').setAttribute('src', msg.imagePath);