当主体受到影响时，如何在主体内的div中添加jquery .not（）？

Question

     $('#button').click(function(){
       $('body').css('-webkit-filter', 'blur(4px)');
     });

When button is clicked, body is turned blur, but i don't want the div inside the body to turn blurred as well. How to do that? can i do that with the .not() jquery function?

Answer 1

No, the not([selector]) function is used for discarding elements from the current jQuery selection. It can't be used for exempting an element from an effect that is applied to one of its ancestor elements.

Answer 2

You could try to apply the blur to everything inside the body, except the div itself.

$('body').children().not('div').toggleClass('blur');

Fiddle

Answer 3

Maybe I misunderstand the question, but couldn't you just add

$('#DIV').css('-webkit-filter', 'blur(0px)');

(where #DIV is the div you don't want blurred) and turn off the blurring on that specific element?

Edit: They were saying in the above answer that it couldn't be done, so maybe something like a container for everything except the div?

http://jsbin.com/eDIPoYU/1/

Answer 4

I would use something like this.

   $('#button').click(function(){
       $('body').css('-webkit-filter', 'blur(4px)');
       $('body').find("div").css('-webkit-filter', 'blur(0px)');
    });