javascript - 无法使用 JQUERY 删除 html 内容

标签 javascript jquery html

我无法删除 ID 为 "Third" 的 div 并在 ID 为 "Fourth" 的 div 中显示结果内容。 请注意:- 我需要将 #Third 内容附加到 #Fourth,然后在稍后阶段删除。


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script src="../jquery-ui-1.10.4.custom/js/jquery-1.10.2.js" type="text/javascript"></script>
    <script src="../jquery-ui-1.10.4.custom/js/jquery-ui-1.10.4.custom.min.js" type="text/javascript"></script>
    <link href="../jquery-ui-1.10.4.custom/css/ui-lightness/jquery-ui-1.10.4.custom.min.css"
        rel="stylesheet" type="text/css" />

    <script type="text/javascript">
        $(function() {
            var widget = {}
            $("#Vshowdialog").click(function() {
                widget.doInitialize();
            });
            widget.doInitialize = function() {
                $("#Fourth").append($("#First").html());
                $("#Fourth").append($("#Second").html());
                $("#Fourth").append($("#Third").html());
                widget.showLightBox();
            };
            widget.showLightBox = function() {
            text = $('#Fourth').html();
            $(text).find("#Third").remove();
            $("#Fourth").dialog();
            };
        });
    </script>

</head>
<body>
    <input type="button" id="Vshowdialog" value="ShowDialog" />
    <div id="First">
        <div id="content">
            This is my main Firstcontent.</div>
        <div id="sidebar">
            This is a FirstSideBar</div>
    </div>
    <div id="Second">
        <div id="secondOne">
            This is my main Second content.</div>
        <div id="secondTwo">
            This is a second sidebar</div>
    </div>
    <div id="Third">
    hello
        <div id="thirdOne">
            This is my main third content.</div>
        <div id="thirdTwo">
            This is a third sidebar</div>
    </div>
    <div id="Fourth">
    </div>
</body>
</html>

最佳答案

您可以使用:

$('#Fourth').append($('#third'));
$('#thirdOne').unwrap();

Working Demo

$('#Fourth').append($('#Third')).find('#thirdOne').unwrap();

Working Demo

关于javascript - 无法使用 JQUERY 删除 html 内容,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24429369/

相关文章:

javascript - 拖放到嵌套的 Div 内

html - moz-border-radius 不适用于 firefox

html - 获取显示 :flex to behave like display:inline-block

javascript - 如何获取 Firefox 附加组件中*当前*页面的 SSL 证书信息

javascript - Bxslider 图像在我刷新页面之前未加载?

javascript - 仅使用一个表达式匹配第一个匹配的更改版本?

javascript - ES6 箭头函数和方法定义的区别

javascript - jQuery 如何使用从单击的 div 中获取的 ID

javascript - 列表组中的链接在触发时不打开(Bootstrap 轮播调整)

html - 获取放置在按钮下方的图像