CODEWITHSUNDEEP
jqueryajax
ivanjonas
ivanjonas

Reputation: 609

Hide ajax-injected elements without touching the ajax call itself

In short, I need to pre-emptively hide elements that will load in a future script.

I am working in a large and messy application. On a particular page, I can run any javascript/jQuery I want, and after it finishes another module will run which I cannot control. This second module injects elements into the DOM that must never be shown to the user (clunky, yes? it's just this particular page that should feature this reversed, unusual behavior; the injected elements are appropriate on all other pages). The point is that I have no access to the ajax call that loads the unwanted DOM elements.

I was thinking of injecting a CSS stylesheet into the page, but I'd like to compare alternatives.

Upvotes: 0

Views: 62

Answers (2)

eg_dac
eg_dac

Reputation: 701

I would use css. This will reduce the latency. If you inject styles after everything is loaded, it will have a "flash" style, meaning it could appear for awhile before disappearing. A user with a slow connection would suffer from this, and mobile devices. If you know the elements that are coming, just use display: none; then after, use jquery to bring it back

Upvotes: 1

Evan
Evan

Reputation: 6115

Just hide the containers where the elements will be injected before the ajax call?

$(containerSelector).hide();

Or injecting CSS. If you have other styling changes that need to be made than injecting CSS would be the way to go, otherwise just hide using jQuery.

Upvotes: 1

Related Questions