评论框

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title></title>
        <style>
            *{margin: 0;padding:0 ;}
            ul,ol,li{list-style: none;}
            a{color: black;}

            #box1{width: 750px;}
            #box1 h3{border-bottom:3px solid blueviolet ;color: blueviolet;}
            #box1 li{width: 750px;border-bottom:1px solid gray ;overflow: hidden;}
            a{float: right;color: gray;}
        </style>
    </head>
    <body>
        <textarea name="text" rows="6" cols="100" id="txt"></textarea>
        <input type="button" value="发表评论" id="but1" />
        <div id="box1">
            <h3>全部评论</h3>
            <ul id="list">
                <li>
                <a href="#" id="shan"></a>
                </li>                
                
            </ul>
            
        </div>
        
    </body>
    <script src="js/评论.js" ></script>
</html>
var oBtn1=document.getElementById('but1');
var oLi=document.getElementById('list');
var oTxt=document.getElementById('txt');


oBtn1.onclick=function(){
	var a=document.createElement('a');
	a.innerHTML="删除";
	a.href='javascript:void(0)';
	a.onclick=function(){
		this.parentNode.parentNode.removeChild(this.parentNode);
	}
	var oCon=document.createElement('li');
	oCon.innerHTML=oTxt.value;
	var te=oLi.children[0];
	oLi.insertBefore(oCon,te);
	oCon.appendChild(a);
	document.getElementById("txt").value=""	
}

  

猜你喜欢

转载自www.cnblogs.com/LLiRo/p/12604603.html