我已经在谷歌上搜索了这个，似乎找不到我要找的东西，所以如果之前重复或回答过，请原谅我......我是网页设计和编程的初学者...
我正在尝试在现有 Div 上方创建新的div 并将较旧的div 推到页面下方，如果我使用 PHP、Javascript 或 CSS，我将如何有效地做到这一点。这是用于评论部分，我知道我需要一个数据库来保存评论，但目前我要做的就是创建重复的 Div，这些 Div 在提交时流向页面。
HTML & PHP：
<html>
<head>
<title>PHP Test</title>
<link href="style.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="wrapper">
<h2><u>Interactive</u></h2>
Let us and others know your thoughts on this subject...
<br />
<h3>Thoughts:</h3>
<div id="form">
<form action="" method="post" >
<textarea name="Comments" rows="8" cols="40" value="" ></textarea>
<input type="submit" value="Submit" name="submit" onclick="location.href='test.php'" />
</form>
</div>
<div id="Quotes">
In this section, will be where your thoughts are displayed for others to see...
<?php
$comments = $_REQUEST ['Comments'];
echo "<div id='comment'>".$comments."</div>";
?>
</div>
</div>
</body>
</html>
.CSS：
body {
}
#wrapper {
margin: 0 auto;
width: 500px;
border: 1px solid black;
}
#comment {
border: 1px solid black;
padding: 5px;
margin: 5px;
text-align: center;
}
这就是我目前所处的位置。
这么多方法...这是JavaScript解决方案，您仍然需要持久化到数据库。我会选择jQuery ajax方法，这样你就不必重新加载整个页面。
<!DOCTYPE=html>
<html>
<head>
<title></title>
</head>
<body>
<textarea id="message" onclick="this.value='';">garbage in garbage out</textarea>
<br />
<input id="btnPostMessage" type="button" value="POST MESSAGE" />
<br />
<div id="comments"></div>
<script type="text/javascript">
var btn = document.getElementById('btnPostMessage');
btn.addEventListener('click', postmsg, false);
function postmsg() {
var date = new Date().toLocaleString();
var msg = document.getElementById('message').value;
var e = document.getElementById('comments');
var newPost = document.createElement('p');
newPost.innerHTML = date + ": " + msg;
e.insertBefore(newPost, e.firstChild);
}
</script>
</body>
</html>
这在jquery中很容易完成。
假设你有一个列表或其他容器来存放你的div
<ul id="yourList">
<li>Item 1</li>
</ul>
$("#yourList").prepend("<li>Item 2</li>");
结果：
<ul id="yourList">
<li>Item 2</li>
<li>Item 1</li>
</ul>