Question

我的div正在关闭。

<html><head><title></title>
<script type="text/javascript" charset="utf-8" src="jquery-1.7.min.js"></script>
<script>

$(document).ready(function(){   
        $("#wrapper").append( '<div id="content"><br>test');
        $("#wrapper").append('<br>whatever');
        $("#wrapper").append( 'sfga<br></div>' );
});
</script>

</head><body>

<div id="wrapper">
</div>

</body></html>

div输出test后自动关闭，而不是像sfga那样。

如何解决这个问题？

Answer 1

肮脏的修复：

var sHTML = '<div ="content"><br>test<br>whateversfga<br></div>';
$("#wrapper").append(sHTML);

正确的做法：

var oNewDiv = $('<div id="content">').append('<br />').append('test');
$("#wrapper").append(oNewDiv);

为什么会这样？因为jQuery在给定原始HTML时会自动创建正确的DOM元素，同时允许您使用上述链接附加到它们。

Answer 2

您正在使用DOM，而不是文本流。

尽管jQuery提供了抽象，但您只能处理元素，而不能使用标记。

 var html = '<div ="content"><br>test' +
            '<br>whatever') + 
            'sfga<br></div>';
 $("#wrapper").append(html);

（请注意，<div ="content">是无稽之谈，但我不知道你的意思，所以我没有尝试修复它。）

Answer 3

为什么不将这三个append电话合并？

$(document).ready(function(){   
    $("#wrapper").append( '<div ="content"><br>test<br>whateversfga<br></div>' );
});

如果你需要在div中放入其他东西，你可以创建一个新的div，然后将其他元素附加到它上面，做这样的事情：

$(document).ready(function(){   
    var $newElem = $('<div class="content"></div>');
    $newElem.append($('<p>test<br />test</p>'));
    $("#wrapper").append($newElem);
});

javascript关闭div追加

3 个答案: