正文
JavaScript实现无刷新评论及在IE下的剪切板访问（学习）
提示：扫一扫查出行【扫一扫了解最新限行尾号】
复制提示
1.无刷新评论
tips：
appendChild：将新元素作为父元素的最后一个子元素进行添加。
insertBefore：在一个指定的子节点之前插入一个节点
实现：
<!DOCTYPE html>
<html>
<head>
<title></title>
<style type="text/css">
#txt{
width:400px;
height:300px;
}
</style>
<script type = "text/javascript">
onload = function() {
var btn = document.getElementById("btn");
btn.onclick = function() {
var p = document.createElement("p");
var txt = document.getElementById("txt").value;
p.appendChild(document.createTextNode(txt));
var ps = document.getElementById("dv").getElementsByTagName("p");
//判断是否已经存在评价
//当评价存在，则将新评论插入到最前
if(ps.length > 0) {
document.getElementById("dv").insertBefore(p,ps[0]); //使用insertBefore将新的评论添加到p标签下第一个元素
}
//如果评论不存在使用appendChild的方法添加评论到p标签下
else {
document.getElementById("dv").appendChild(p);
}
}
}
</script>
</head>
<body>
<textarea id="txt"></textarea>
<br/>
<input type="button" id = "btn" value="评论"/>
<br/>
<div id="dv">
</div>
</body>
</html>
2.IE下剪切板的访问
tips：
window.clipboardData.setData("text",文本)："text"为固定属性。添加文本数据到剪切板。
window.clipboardData.getData("text")："text"为固定属性。获取剪切板中的数据。
window.location：对象用于获得当前页面的地址 (URL)，并把浏览器重定向到新的页面
实现：
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>禁止复制</title>
<script type="text/javascript">
onload = function () {
//仅仅支持IE浏览器
var btn = document.getElementById("btn");
var bpase = document.getElementById("btncopy");
var txt = document.getElementById("txt");
btn.onclick = function () {
var h = location.href;
window.clipboardData.setData("text",h);
}
bpase.onclick = function () {
var ptxt = window.clipboardData.getData("text");
txt.value = ptxt;
}
}
</script>
</head>
<body>
<textarea id="txt" style="height:200px;width:400px;">
</textarea>
<input type="button" id="btn" value="点击复制当前网页地址" />
<input type="button" id="btncopy" value="粘贴入文本框" />
</body>
</html>
