jQuery append（）在所有其他元素之前添加元素(jQuery append() adds element before all others)

jQuery append（）在所有其他元素之前添加元素(jQuery append() adds element before all others) <div style="width: 100%; height: 50%;"> Enter URL: <input id="addressText" type="text" style="width: 60%;"/> <input id="sendRequestButton" type="button" value="Get"/> </div> <div id="container" style="width: 100%; height: 50%;"></div>

后来，我有：

$(document).ready(function() { $("#sendRequestButton").click(function() { $("#container").append("Blablabla"); } }

出于某种原因，新文本出现在页面上的每个其他元素之前！ 这是什么原因，我该如何解决？ 谢谢。

<div style="width: 100%; height: 50%;"> Enter URL: <input id="addressText" type="text" style="width: 60%;"/> <input id="sendRequestButton" type="button" value="Get"/> </div> <div id="container" style="width: 100%; height: 50%;"></div>

Later, I have:

$(document).ready(function() { $("#sendRequestButton").click(function() { $("#container").append("Blablabla"); } }

For some reason, the new text appears before every other element on the page! What's the reason for that and how can I fix it? Thanks.

最满意答案

奇怪的是，你的代码很适合。 你确定没有其他的id="container"吗？

$("#sendRequestButton").click(function(){
  $("#container").append("Blablabla");
}); 
  
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div style="width: 100%; height: 50%;">
    Enter URL: <input id="addressText" type="text" style="width: 60%;"/>
    <input id="sendRequestButton" type="button" value="Get"/>
</div>
<div id="container" style="width: 100%; height: 50%;"></div> 
  
 
Strange, that works well with your code. Are you sure to not have an other id="container" somewhere?
 
 
 
  
  
$("#sendRequestButton").click(function(){
  $("#container").append("Blablabla");
}); 
  
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div style="width: 100%; height: 50%;">
    Enter URL: <input id="addressText" type="text" style="width: 60%;"/>
    <input id="sendRequestButton" type="button" value="Get"/>
</div>
<div id="container" style="width: 100%; height: 50%;"></div>