忘记用css美化了，丑陋的界面

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script type="text/javascript" >
        function $$(id) {
            return document.getElementById(id);
        }
        function pageload(){
            var drag=document.getElementsByTagName("img");
            for(var intI=0;intI<drag.length;intI++)
            {
                drag[intI].addEventListener("dragstart",
                        function(e){
                            var objDtf=e.dataTransfer;//拖拽数据传递对象，一般使用方式event.dataTransfer
                            objDtf.setData("text/html",addCart(this.title,this.alt,1));
                        },
                        false);
            }
            var Cart=$$("ulCart");
            Cart.addEventListener("drop",
                    function(e){
                        var objDtf=e.dataTransfer;
                        var strHTML=objDtf.getData("text/html");
                        Cart.innerHTML+=strHTML;
                        e.preventDefault();
                        e.stopPropagation();
                    },false
            );
        }
        document.οndragοver=function(e){
            e.preventDefault();
        }
        document.οndrοp=function(e){
            e.preventDefault();
        }
        function addCart(a,b,c){
            var strhtml="<li class='lic'>";
            strhtml+="<span>"+" "+a+" "+"</span>";
            strhtml+="<span>"+" "+b+" "+"</span>";
            strhtml+="<span>"+" "+c+" "+"</span>";
            strhtml+="<span>"+" "+b*c+" "+"</span>";
            strhtml+="</li>";
            return strhtml;
        }
    </script>
</head>
<body οnlοad="pageload();">
    <ul>
        <li class="aa">
            <img src="2.jpg" id="img02" alt="42" title="2009" draggable="true">
            <!-- 无法显示时替代的文本 ;可拖拽 -->
        </li>
        <li class="aa">
            <img src="1.jpg" id="img03" alt="56" title="2010" draggable="true">
        </li>
        <li class="aa">
            <img src="3.jpg" id="img05" alt="59" title="2011" draggable="true">
        </li>
    </ul>
    <ul id="ulCart">
        <li class="bb">
            <span>name</span>
            <span>price</span>
            <span>number</span>
            <span>total</span>
        </li>
    </ul>
</body>
</html>

说实话拽的时候位置挺不好控制的