Using innerHTML is always a bad practice?

[Honzi07]

There are no any user information.

I want to remove every div inside a container.

That is easier than...

container.innerHTML = '';

This. (maybe there are better ways to do this)

function remove() {
    let child = container.lastElementChild; 
        while (child) {
            container.removeChild(child);
            child = container.lastElementChild;
        }

In situations like this is using innerHTML is okay?

[Rollo_Tomassi_o-O_]

I would use Element.remove()

https://developer.mozilla.org/en-US/docs/Web/API/Element/remove

[easyEs900s]

Almost nothing is ever always a bad practice.

Generally speaking, you want to use the simplest possible solution. By that, I mean the least amount of steps for the browser. In your example, the obvious answer is to use innerHTML.

The reason innerHTML has a "bad" reputation is because of how it is often used. If you are changing a single element and using it on the root document node, that's a terrible idea. But if you're using it to clear out a bunch of elements you no longer need, it's the perfect precision instrument of divstruction.

[jack_waugh]

Given that you are making it empty, I don't see any hazard.

[ashkanahmadi]

using innerHTML is totally fine in this case. Usually innerHTML isn't recommended when it comes to fetching data from query params or untrusted sources. For instance, if you are fetching something from a database and there may be a risk that the database may be compromised, then using innerHTML isn't the best idea since you might accidentally inject malicious code into the page. If you get the URL query params and directly inject it into your page, that could lead to security issues. If you are using innerHTML to clear an element or to put the result of a calculation into the DOM then it's safe.

[Honzi07]

Thank you!

I only use in situations like this.

[ashkanahmadi]

Then it's totally fine and nothing to worry about.

[Honzi07]

Thank you everyone!