Oh okay... So, the code is working, it matches only the DIV and appends that
DIV. However, that DIV still contains the other elements. The .not method
doesn't actually remove elements from the DOM just from the jQuery
collection. I can see how this can be confusing for what you are trying to
achieve. Instead of using .not try using .filter and passing in a function.
Maybe like this:
s = $(s)
.find('*').andSelf()
.filter( function() {
var $this = $(this);
if ( $this.is('script, hr, img') ) {
// remove the element from the DOM
$this.remove();
// remove the element from the jQuery collection
return false;
}
// Otherwise keep the element in the jQuery collection
return true;
});
Hope that helps! :)
--
Brandon Aaron
On 9/22/07, Pops <[EMAIL PROTECTED]> wrote:
>
>
> Hi Brandon,
>
> Let me try this ....
>
> I'm not seeing it work. Here is my test code. I tried all 3 methods:
>
> <html>
> <head>
> <script type='text/javascript' src='/public/js/jquery-1.2.1.js'></
> script>
> <script>
> //<!--
> function testFilter()
> {
> var s = "";
> s += "<script>$('body').append('<button>foobar1</button>');</
> script>";
> s += "<hr style='background: yellow; height: 10px;'/>";
> s += "<img src='http://www.santronics.com/images/
> WINSbox-120x120.gif'/>";
> s += "<div style='border: 2px solid silver;'>";
> s += "Hi there!";
> s += "<img src='http://www.santronics.com/images/
> WINSbox-120x120.gif'/>";
> s += "<hr style='background: green; height: 10px;'/>";
> s += "<script>$('body').append('<button>foobar2</button>');</
> script>";
> s += "</div>";
> s += "<img src='http://www.santronics.com/images/
> WINSbox-120x120.gif'/>";
> s += "<hr style='background: cyan; height: 10px;'/>";
> s += "<script>$('body').append('<button>foobar3</button>');</
> script>";
>
> //s = $(s).not('script, hr, img');
> //s = $('*',s).andSelf().not('script, hr, img');
> s = $('*',s).add(s).not('script, hr, img');
> $("#wcResult").html(s);
> }
> //-->
> </script>
>
> </head>
> <body>
>
> <button onclick="testFilter();">test filter</button>
>
> <div id="wcResult" style="padding: 10px; border: 1px solid black;">
> </div>
> </body>
> </html>
>
> With all methods, the top and bottom elements are filtered, but the
> elements within the <div> remain.
>
> What am I missing?
>
> BTW, for this real case scenario, my workaround is to use .text(), but
> I will need to give people the option to some minimum secured html.
>
> --
> HLS
>
>
> On Sep 22, 1:39 pm, "Brandon Aaron" <[EMAIL PROTECTED]> wrote:
> > The .not and .filter methods only run against the matched elements
> within
> > the jQuery collection. In order to filter all elements you will need to
> add
> > all elements to the collection. I think something like this should work
> > (untested).
> >
> > $('*', data).andSelf().not('style, meta, link, script, title, img');
> >
> > andSelf is a jQuery 1.2 method. If you are using an earlier version you
> > could use $('*', data).add(data)
> >
> > --
> > Brandon Aaron
> >
> > On 9/22/07, Pops <[EMAIL PROTECTED]> wrote:
> >
> >
> >
> > > I noticed some example using something like so:
> >
> > > data = $(data).not("style, meta, link, script, title");
> >
> > > to filter out thes tags.
> >
> > > I tried using this to filter img as well:
> >
> > > data = $(data).not("style, meta, link, script, title, img");
> >
> > > and what I noticed is that this doesn't work if the elements are
> > > within other elements.
> >
> > > For example, I have this simple example:
> >
> > > <img src="1">
> > > <div>
> > > <img src="2">
> > > </div>
> > > <img src="3">
> >
> > > In this case, only img 1 and 3 will be filtered out. img 2 will
> > > remain.
> >
> > > I am wondering if that is proper behavior for .not(elements)?
> >
> > > My goal is to filter all elements regardless of node or branch
> > > depth.
> >
> > > Thanks
> >
> > > --
> > > HLS
>
>
