Remove and load

[XaviJr]

Hi guys. I want to make this javascript code that get all tab contents from HTML, remove them, and then load them only when the user click on the tab. Is this possible?

[Paulie_D]

What do you have so far?

Do you have a link?

Could you put something in Codepen for us to play with?

[XaviJr]

I don’t have an example code but I’m making one now.

I know how to select the elements but I don’t know any function to remove the selected elements and other to load them. load() is just used to load external files right?

[David_Leitch]

As a starting point, the ‘[Tabbable Nav](http://twitter.github.com/bootstrap/components.html#navs “http://twitter.github.com/bootstrap/components.html#navs”)’ from Twitter Bootstrap comes to mind. I don’t know the workings behind it, but it seems to achieve what you’re looking for, so perhaps have a look at how that works?

[XaviJr]

Thank you for your tip David, I will look into the code of that to figure it out.
If anyone have other tips please let me know. I prefer to understand how can this be done and not use an external library.

[XaviJr]

I want to really remove it but thank you for the input.

[Paulie_D]

>I want to really remove it but thank you for the input.

Actually, I don’t think so.

I’m assuming that you don’t want it loaded on pageload at all but only want it to be inserted on a click event.

Is that more like it?

[XaviJr]

Something like that, yes. But if I have the display:none the content is loaded anyway right? It’s just hidden.

[Paulie_D]

> if I have the display:none the content is loaded anyway right? It’s just hidden.

Yes it is….To be honest the solution will depend on what you effect are trying to achieve and why.

[XaviJr]

Let me try to explain.

It’s like a plugin. I want to have the ability to grab the HTML objects, stop them from loading and then load it only with the click action. Like some slideshows do I think.

[Paulie_D]

Yeah, but are you planning on having these ‘objects’ in your page HTML and hidden prior to load or inserted INTO the page HTML on a click.

The two are different.

[XaviJr]

Inserted into, not hidden, because it can be videos/images so I don’t want to have a slow load. I hope I’m making myself clear.

[XaviJr]

I know andy, that’s why I made this question in Javascript section, but I don’t know what functions can I use to save, remove and load the HTML stuff. That’s my question.

[Paulie_D]

There you go folks…I’m no JS / AJAX expert (or even a novice) but that’s what he’s after.

Over to you.

[XaviJr]

Thank you both for clear that out.

[Author]

Posts