Jquery 验证是否是查看div是否为空的正确方法？

网址：

我试图在按下图像“DragonUp”时验证div，并检查该值是否为空。如果它是空的，那么它将附加一个段落和图像的div，如果它确实有文本，那么它将清空该div。这不起作用，验证是正确的方法吗

<div id="description"></div>
<p id="checkOut">
You should check out some of my work
</p>
</div>
<section id="portfoliopics">
<p>Information Architecture</p>
<img src="images/dragonup.png" id="dragonup" alt="DragonUp">
<img src="images/province.jpg" id="provincesports" alt="The Province Sports">
<img src="images/ayogo.jpg" id="ayogo" alt="ayogo">
<p>Design</p>
<img src="images/rebellious.png" alt="Rebellious by Nav" id="rebellious">
<img src="images/attack.png" alt="Attack of the Space Leprechauns">
<p>Development</p>
<img src="images/form.png" alt="Form Design" id="formdesign">
<img src="images/imageswap.png" alt="Image Swap">
<img src="images/popup.png" alt="Pop-up Window">
<img src="images/learningios.png" alt="Learning iOS Development" id="learningios">
<p>More Stuff</p>
<img src="images/canucks.jpg" alt="canucks">
<img src="images/saveinte.png" alt="Save Interactive Design">
</section>

$(document).ready(function() {
    $("#dragonup").click(function() {
        $('#description').val();
        if ('#description' === '') {
        $('#description').empty();
        $("#description").prepend('<p><class id="blueText">You are viewing: DragonUp Wireframes </class><br> Role: User Experience Design<br><br>DragonUp is a game created by East Side Games for iOS and it is currently being ported over to Facebook. It is a game that draws inspiration from Dragonvale and Tiny Tower and has players building up a collection of dragons. Kotaku describes it as A dragon vomit harvesting game, and that makes all the difference.<br><br>I was tasked with proposing a re-design of its UI. Currently, the game has 10 different options in the menu. With this in mind, my goal was to create a more streamlined menu for new users and more fluid navigation for experienced players. I was able to achieve this and accomplished having four different options in the menu while still containing the same functionality and increasing usability.</p>');
                $("#description").append('<img src="images/work/dragonup-wireframe1.png">');
                $("#beforeClick").remove();
                $('#checkOut').empty();
                $('#checkOut').append('You should also check out:');
            }
            else {
                $('#description').empty();
            }
    })
})

你应该看看我的一些作品

信息架构

设计

发展

更多的东西

$（文档）.ready（函数（）{
$（“#向上”）。单击（函数（）{
$（'#description'）.val（）；
如果（'#说明'=''）{
$（'#description'）.empty（）；
$（“#说明”）。前置（您正在观看的：DragonUp线框
角色：用户体验设计

DragonUp是由East Side Games为iOS创建的一款游戏，目前正在移植到Facebook。这款游戏从Dragonvale和Tiny Tower汲取灵感，玩家们正在收集龙。Kotaku将其描述为龙的呕吐物授予游戏，这让一切都不同。

我的任务是建议重新设计它的UI。目前，该游戏的菜单中有10个不同的选项。考虑到这一点，我的目标是为新用户创建一个更精简的菜单，为有经验的玩家创建更流畅的导航。我能够实现这一点，并实现了以下目标：r菜单中的不同选项，同时仍然包含相同的功能并提高了可用性。
'）；
$（“#说明”）。附加（“”）；
$（“#单击前”）.remove（）；
$（'#checkOut'）.empty（）；
$（“#签出”）.append（'您也应该签出：'）；
}
否则{
$（'#description'）.empty（）；
}
})
})

它应该是：

$('#description').html();

.val（）

用于输入

它应该是：

$('#description').html();

---

.val（）

用于输入

您正在测试错误的东西-您的代码

如果（“#描述”===”）

永远不会验证，您需要将其更改为

如果（$（“#描述”）.text（）==”
您正在测试错误的东西-您的代码
如果（“#描述”==”）
将永远不会验证，您需要将其更改为
if（$（'#description'）。text（）=''）

这将比较两个明显不相等的文本字符串，因此总是给出一个
false
结果。您需要检索
#description
元素并检索有关它的一些信息

有很多方法可以做到这一点：


if（$（'#description'）.html（）==''{…}

如果
#description
元素的html内容为空，则这将匹配。保留文本节点和注释
if（$（'#description'）.text（）==''{…}

如果
#description
元素的文本内容为空（文本内容是它的“平面”内容，例如HTML标记被剥离），则这将匹配。注释将被丢弃
if（$（'#description'）.children（）.length==0）{…}

如果
#description
元素没有子元素，这将匹配。不考虑文本节点和注释，即根据此方法，
Foo
没有子节点

如果您知道只需要关心实际的子节点（例如
标记），
.children（）.length
可能是最简单的选择。否则，您必须查看实际的文本内容，可能还需要查看
.trim（）
，然后再检查其是否为空：

或相当于：

if ($('#description').text().trim().length === 0) { ... }

这将比较两个明显不相等的文本字符串，因此总是给出一个
false
结果。您需要检索
#description
元素并检索有关它的一些信息

有很多方法可以做到这一点：


if（$（'#description'）.html（）==''{…}

如果
#description
元素的html内容为空，则这将匹配。保留文本节点和注释
if（$（'#description'）.text（）==''{…}

如果
#description
元素的文本内容为空（文本内容是它的“平面”内容，例如HTML标记被剥离），则这将匹配。注释将被丢弃
if（$（'#description'）.children（）.length==0）{…}

如果
#description
元素没有子元素，这将匹配。不考虑文本节点和注释，即根据此方法，
Foo
没有子节点

如果您知道只需要关心实际的子节点（例如
标记），
.children（）.length
可能是最简单的选择。否则，您必须查看实际的文本内容，可能还需要查看
.trim（）
，然后再检查其是否为空：

或相当于：

if ($('#description').text().trim().length === 0) { ... }

谢谢。我已经做了这个更改。它仍然不会追加。有趣又好看的公文包！；）谢谢。我做了这个改变。它仍然不会追加。有趣且好看的公文包！；）