Find empty DOM elements and remove them with Jquery/Javascript -
i have 3 columns, each of them containing div
. these div
's filled data happens, these div
's empty , in case screw layout. want check if div
's filled data (html) , if not, remove them. made if
-statements i'm sure can done smoother.
here js code:
if ($.trim($(".fcol1").html()) =='') { $(".fcol1").remove(); } if($.trim($(".fcol2").html()) == '') { $(".fcol2").remove(); } if($.trim($(".fcol3").html()) == '') { $(".fcol3").remove(); }
so, there way shorten code?
if they're truly empty, can do:
$(".fcol1:empty, .fcol2:empty, .fcol3:empty").remove();
...but if have blank text node in them, won't work. do:
$(".fcol1, .fcol2, .fcol3").filter(function() { return !$.trim(this.innerhtml); }).remove();
note original code checks first element matching selector and, if 1 element empty, deletes all matching elements whether they're empty or not. e.g., if first .fcol1
empty, all .fcol1
s deleted. (perhaps have 1 of each...)
Comments
Post a Comment