淺談每天熬夜寫代碼的感想

   最近一段時間確實代碼寫的不少,再過幾天就要上項目,又是要加班的節奏啊.

之前一個大神一直說:不要爲了寫代碼而寫代碼,之前一直不懂,但保持着好學的心態,每天兩三點睡覺,然後發覺並沒有什麼用。理解,理解 ,理解比什麼都重要,思路要清晰,其他都是浮雲。

今天朋友讓我寫個模擬keywords搜索的代碼,竟然寫了快一個小時,深深感覺到思路的重要性,爲了明天,繼續向着敲代碼前進!


代碼如下:

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <style>
        #box {
            width: 450px;
            margin: 200px auto;
        }

        #txt{
            width: 350px;
        }
        #pop {
            width: 350px;
            border: 1px solid red;
        }

        #pop ul {
            margin: 10px;
            padding: 0px;
            width: 200px;
            list-style-type: none;

        }
        #pop ul li {

        }
        .hp{
            margin-top: 5px;
            font-family: "微軟雅黑";
            cursor: pointer;
        }

    </style>
</head>
<body>
<div id="box">
    <input type="text" id="txt" value="">
    <input type="button" value="搜索" id="btn">
</div>
<script src="common.js"></script>
<script>
    var keyWords=["小楊纔是最純潔的","小楊纔是最帥的","小段是最猥瑣的","小超是最齷齪的","蘋果好吃","蘋果此次召回還是沒有中國"];
    //先建立鼠標擡起事件
    my$("txt").onkeyup=function() {
        if(my$("dv")){
            my$("box").removeChild(divObj);
        };
        //存入輸入的內容
        var arr = [];
        var text = this.value;//文本框的內容
        //判斷輸入的內容有沒有keyword中存在的
        for (var i = 0; i < keyWords.length; i++) {
            //判斷輸入的內容裏有沒有keywords裏面的,並且等於0即索引剛開始有
            if (keyWords[i].indexOf(text) == 0) {
                arr.push(keyWords[i]);
            }
        };

        if(this.value.length==0||arr.length==0){
            //判斷需要多理解
            if(my$("dv")){
                my$("box").removeChild(divObj);
            }
            return;
        }
            var divObj = document.createElement("div");
            divObj.id="dv";
            divObj.style.width = "350px";
//            divObj.style.height = "200px";
            my$("box").appendChild(divObj);
            divObj.style.border = "1px solid red";
        //取出arr 裝進div中 遍歷
        for(var i =0;i<arr.length;i++){
            //創建p.放到div            var pObj=document.createElement("p");
            divObj.appendChild(pObj);
            pObj.innerHTML=arr[i];
            pObj.className="hp";
            pObj.onmouseover=mouseoverHandle;
            pObj.onmouseout=mouseoutHandle;
        }
        function mouseoverHandle(){
            this.style.backgroundColor="yellow";
        };
        function mouseoutHandle(){
            this.style.backgroundColor="";
        };

    };

</script>
</body>
</html>

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章