下面的代码是非工作代码，对于这个问题来说，这一点都不重要。代码下方的问题！
HTML
<body>
<div class="wrapper">
<div id="popup1"></div>
</div>
</body
CSS
.wrapper #popup {
color: #fff;
}
jQuery
var setpopupoutsidewrapper = $('#popup1');
setpopupoutsidewrapper.detach();
setpopup1outsidewrapper.appendTo('body');
分离/附加函数后，CSS/HTML之间的链接是否会保持不变
一旦popup1是主体的子级，并且不再是.wrapper的子级时，CSS选择器将不再应用。.wrapper #popup表示在类为wrapper的元素下面的某个地方有一个id为popup1的子代(不一定是直接子代，请使用>选择器)。一旦popup1是身体的直接子体，它将不再是真的。
如上面的注释所述，您可以删除选择器的wrapper部分，并且无论popup1在层次结构中的哪个位置，它都将继续应用。
#popup {
color: #fff;
}
这现在只适用于id为popup1的元素，并且不考虑其祖先。