Javascript 正在追加和删除图像，但未删除文本jQuery

这是我的代码：

<input type = checkbox id = "kinch" name = "link" > Bunz </input>
<div id = bootypipe></div>

Bunz

下面是JavaScript：

$("#kinch").click(function(){

    if ($("#kinch").is(":checked")) {

        //Add image to div bootypipe
         $("#bootypipe").append("<image id = 'chink' src = 'http://4.bp.blogspot.com/_TUdhYRa2Xm0/RsuDa4NvSEI/AAAAAAAAAQs/jr_r6v_SUgs/s320/New-England-Style-Hot-Dog-Buns_8A827671.jpg'>HA!</image>");

    } else {


        $("#chink").remove();

    }
});

$（“#kinch”）。单击（函数（）{
如果（$（“#kinch”）。为（“：选中”））{
//将映像添加到div bootype
$（“#bootype”）.append（“HA！”）；
}否则{
$（“chink”）.remove（）；
}
});

以下是JSFIDLE：

图像删除和追加，但当我删除图像时，文本

Ha仍然会随着时间的推移而保留和建立。如何删除此项？
HA！
<image id = 'chink' src = 'http://4.bp.blogspot.com/_TUdhYRa2Xm0/RsuDa4NvSEI/AAAAAAAAAQs/jr_r6v_SUgs/s320/New-England-Style-Hot-Dog-Buns_8A827671.jpg'>HA!</image>


是无效的HTML标记；元素实际上不能包含文本。正确的标签是
HA！

这意味着文本不是元素的一部分，也不会随元素一起删除

不要执行
$（'chink'）.remove（）
，而是执行
$（'bootypee'）.empty（）
删除您添加的所有内容。
HA！

是无效的HTML标记；元素实际上不能包含文本。正确的标签是
HA！

这意味着文本不是元素的一部分，也不会随元素一起删除

不要执行
$（'#chink'）.remove（）
，而是执行
$（'#bootypee'）.empty（）
删除您添加的所有内容。
因为您只删除图像标记，而不删除文本。你可以这样做

用一个div包装图像和文本，然后删除div标记，如

<img id='chink' src='...' > HA!

$（“#kinch”）。单击（函数（）{
如果（$（“#kinch”）。为（“：选中”））{
//将映像添加到div bootype
$（“#bootype”）.append（“HA！”）；
}否则{
$（“#chink_outer”）.remove（）；
}
});

因为您只删除图像标记，而不删除文本。你可以这样做

用一个div包装图像和文本，然后删除div标记，如

<img id='chink' src='...' > HA!

$（“#kinch”）。单击（函数（）{
如果（$（“#kinch”）。为（“：选中”））{
//将映像添加到div bootype
$（“#bootype”）.append（“HA！”）；
}否则{
$（“#chink_outer”）.remove（）；
}
});

你就不能这样做：

$("#kinch").click(function(){

    if ($("#kinch").is(":checked")) {

        //Add image to div bootypipe
         $("#bootypipe").append("<div id='chink_outer'><img id = 'chink' src = 'http://4.bp.blogspot.com/_TUdhYRa2Xm0/RsuDa4NvSEI/AAAAAAAAAQs/jr_r6v_SUgs/s320/New-England-Style-Hot-Dog-Buns_8A827671.jpg'/>HA!</div>");

    } else {


        $("#chink_outer").remove();

    }
});

而不是删除图像。
您不能只执行以下操作：

$("#kinch").click(function(){

    if ($("#kinch").is(":checked")) {

        //Add image to div bootypipe
         $("#bootypipe").append("<div id='chink_outer'><img id = 'chink' src = 'http://4.bp.blogspot.com/_TUdhYRa2Xm0/RsuDa4NvSEI/AAAAAAAAAQs/jr_r6v_SUgs/s320/New-England-Style-Hot-Dog-Buns_8A827671.jpg'/>HA!</div>");

    } else {


        $("#chink_outer").remove();

    }
});

而不是删除图像。
该
HA
 ”；
}否则{
$（'p'）。删除（）；
//或者$（'chink'）.parent（）.remove（）；//选择你的毒药
}
});
HA！
”；
}否则{
$（'p'）。删除（）；
//或者$（'chink'）.parent（）.remove（）；//选择你的毒药
}
});