在页面加载后删除div时jQuery冲突

Question

I'm trying to remove a div from the page (preferably prevent it from loading at all) but for now I'm settling on removing it after the page loads.

When I try the following lines of code in jsFiddle , the #content div gets removed, as expected.

<script type='text/javascript'>//<![CDATA[ 
  $(window).load(function(){
      $('#content').remove();
  });//]]>  
</script>

However, I have also tried implementing it on an actual website , but in that case, the #content div isn't removed.

Any suggestions as to what might be wrong?

Answer 1

If you're sharing jQuery with another library that uses the dollar for its operation you need to guard against it like this, using an anonymous wrapper:

(function($) {
    $(window).on('load', function(){
        $('#content').remove();
    });
}(jQuery));

Note that instead of .load() I'm using .on('load', fn).

Instead of on page load you could also bind your code on DOM ready; jQuery passes itself as the first argument to the inner function:

jQuery(function($) {
    $('#content').remove();
});

Answer 2

Your $ variable does not point to jQuery for some reason.

<script type='text/javascript'>
    window.$ = jQuery;
    $(window).load(function()
    {

        $('#content').remove();
     });
</script>

Answer 3

use this:

<script type="text/javascript">
var node = document.getElementById('content'); 
if(node.parentNode)
{ 
node.parentNode.removeChild(node);
}
</script>

Hope this help.

Answer 4

Try with this

<script type='text/javascript'> 
    $(document).ready(function(){
         $('#content').remove();
    });
</script>

or

$(function()
{
        $('#content').remove();
});

Answer 5

It's because you have a javascript error when you call $(window).load() .

Uncaught TypeError: Object [object global] has no method 'load'

Also, you should better use document.ready instead as the content will be removed faster (doesn't need to wait for all the images to load).

//shorthand for $(document).ready()
$(function(){
    $('#content').remove();
});

Answer 6

TypeError: $(...).load is not a function

It is giving error above instead of below one as load is deprecated in new version of Jquery

$(window).load(function(){
});

use this code

$(function(){
 // your code here
})

Answer 7

You are using jQuery testing with onload,

so you have to add onload syntax in jquery, on your site the statement was not called onload, that why its not working

I have updated fiddle

http://jsfiddle.net/MarmeeK/FRYsJ/3/

The JS code under <script> tag, without adding in onload in page,

<script type="text/javascript">
    $(document).ready(function(){$('#content').remove();});
</script>

this should work :)

Answer 8

Case of jquery conflict. You have mootools framework too on the page.

Also I did a 'view source' of the page and I found out this line

$j = jQuery.noConflict();  //line 132

So try this

$j('#content').remove();
Or
jQuery('#content').remove();