Javascript 如何使用jquery删除和重新创建元素?

Javascript 如何使用jquery删除和重新创建元素?,javascript,jquery,Javascript,Jquery,我有元素,我想在responsive上删除此元素,但我想在桌面上重新创建 我的意思是我想在if中删除这个元素,我想在else中再次创建 我的项目就是这样的 $window.resizefunction{ 变量宽度=$window.width; 如果宽度为什么不尝试隐藏和显示,因为如果删除它,则需要一些隐藏元素来克隆它或将其添加回。我建议您使用隐藏/显示 $(window).resize(function(){ var width = $(window).width(); if(wi

我有元素,我想在responsive上删除此元素,但我想在桌面上重新创建

我的意思是我想在if中删除这个元素,我想在else中再次创建

我的项目就是这样的

$window.resizefunction{ 变量宽度=$window.width;
如果宽度为什么不尝试隐藏和显示,因为如果删除它,则需要一些隐藏元素来克隆它或将其添加回。我建议您使用隐藏/显示

$(window).resize(function(){
   var width = $(window).width();
   if(width <=768){
       $('.element').hide();
   }else{
       $('.element').show();
  }
}).resize();
或者,如果要使用remove,则创建一个全局变量并将.element分配给它


为什么要删除并还原它以实现响应式设计?您可以改用CSS媒体查询,这对资源更加友好,总体而言是更好的方法:

@media(screen and max-width: 768px) {
    .element {
        display: none;
    }
}
如果您必须使用JS,那么应该使用.hide和.show,这两个函数除了通过JQuery外,基本上做相同的事情:

$(window).resize(function() {
   var width = $(window).width();

   if(width <= 768) {
       $('.element').hide();
   } 
   else {
       $('.element').show();
  }
}).resize();

如果我不明白你的意思,而你实际上必须通过删除和还原的JS方式来完成,请在评论中告诉我,我会尽力帮助你。

如果你真的想删除该元素,当你想再次插入它时,不要使用“删除”。使用“分离”

下面是一个来自


分离可确保元素保留与之关联的jQuery数据,以备日后使用。

为什么不使用css媒体查询脚注:请不要隐藏它,因为它在我滚动时显示,如果我在移动设备上滚动后隐藏它,它将再次显示..你所说的这个div在我滚动时显示的确切含义是什么?脚注:请e我不想隐藏它,因为当我滚动时it div正在显示,然后如果我在移动设备上滚动后隐藏它,那么它将再次显示..对不起,我真的不明白你的意思。一旦分辨率达到最大值,使用媒体查询将在与媒体查询兼容的任何设备上的任何视图中完全隐藏元素嗯,有768像素,包括768像素。很抱歉我的英语不好。所以这个元素是桌面上的隐藏元素,可以向下滚动。这就是为什么如果我在滚动后隐藏在手机上,它会再次显示。当您使用我提供的媒体查询时,不会发生这种情况,例如滚动,或者任何事件,除非您重写,否则不会更改媒体查询CSS规则显示有一个!重要的附录。但我尝试过了,我不想用任何重要的东西来显示或隐藏注意:请注意,我不想隐藏它,因为当我滚动时它会显示,然后如果我在移动设备上滚动后隐藏它,那么它会再次显示。@ani_CSS你在这个问题中到处都放了这个注释,但它没有无论如何
@media(screen and max-width: 768px) {
    .element {
        display: none;
    }
}
$(window).resize(function() {
   var width = $(window).width();

   if(width <= 768) {
       $('.element').hide();
   } 
   else {
       $('.element').show();
  }
}).resize();
var el = $('.element');
if(width <=768){
    el.detach();
}else{
    $(body).append(el);
}