黑马程序员-javascript学习之代码示例

来源：互联网发布：肛门调教知乎编辑：程序博客网时间：2024/04/30 16:56

---------------------- Windows Phone 7手机开发、.Net培训、期待与您交流！ ----------------------

（1）走马灯效果

<html xmlns="http://www.w3.org/1999/xhtml"><head>    <title>123456789</title>    <script type="text/javascript">        function scrollRight() {            var title = document.title;            var lastCh = title.charAt(title.length - 1);            var leftStr = title.substring(0, title.length - 1);            document.title = lastCh + leftStr;        }        function scrollLeft() {            var title = document.title;            var lastCh = title.charAt(0);            var leftStr = title.substring(1, title.length);            document.title = leftStr + lastCh;        }        var IntervalId;        function left() {            if (IntervalId) {                clearInterval(IntervalId);                IntervalId = setInterval('scrollLeft()', 500);            }            else {                IntervalId = setInterval('scrollLeft()', 500);            }        }        function right() {            if (IntervalId) {                clearInterval(IntervalId);                IntervalId = setInterval('scrollRight()', 500);            }            else {                clearInterval(IntervalId);                IntervalId = setInterval('scrollRight()', 500);            }        }        function stop() {            clearInterval(IntervalId);        }    </script></head><body><input type="button" value="left" id="leftInverval" onclick="left()" /><input type="button" value="right" id="rightInverval" onclick="right()" /><input type="button" value="stop" id="stopInverval" onclick="stop()" /></body></html>

（2）全选、全部选、反选

<html xmlns="http://www.w3.org/1999/xhtml"><head>    <title></title>    <script type="text/javascript">        function selAll() {            var playlist = document.getElementById("playlist");            var inputs = playlist.getElementsByTagName("input");            for (var i = 0; i < inputs.length; i++) {                var input = inputs[i];                if (input.type == "checkbox") {                    input.checked = "checked";                }            }        }        function deSelAll() {            var playlist = document.getElementById("playlist");            var inputs = playlist.getElementsByTagName("input");            for (var i = 0; i < inputs.length; i++) {                var input = inputs[i];                if (input.type == "checkbox") {                    input.checked = "";                }            }        }        function reverseSel() {            var playlist = document.getElementById("playlist");            var inputs = playlist.getElementsByTagName("input");            for (var i = 0; i < inputs.length; i++) {                var input = inputs[i];                if (input.type == "checkbox") {                    input.checked = !input.checked;                }            }        }    </script></head><body><div id="playlist">    <input type="checkbox" id="p1" /><label for="p1">p1</label>    <input type="checkbox" id="p2" /><label for="p2">p2</label>    <input type="checkbox" id="p2" /><label for="p3">p2</label></div><input type="button" value="全选" onclick="selAll()" /><input type="button" value="全不选" onclick="deSelAll()" /><input type="button" value="反选" onclick="reverseSel()" /></body></html>

（3）权限选择项

<html xmlns="http://www.w3.org/1999/xhtml"><head>    <title></title>    <script type="text/javascript">        function moveSelected(selSrc, selDest) {            for (var i = selSrc.childNodes.length-1; i >= 0; i--) {                var option = selSrc.childNodes[i];                if (option.selected == true) {                    selSrc.removeChild(option);                    option.selected = false;                    selDest.appendChild(option);                }                }        }        function moveAll(selSrc, selDest) {            for (var i = selSrc.childNodes.length - 1; i >= 0; i--) {                var option = selSrc.childNodes[i];                selSrc.removeChild(option);                selDest.appendChild(option);            }        }            </script> </head> <body> <select style="float:left;width:15%;height:100px" id="select1" multiple="multiple"> <option>添加</option> <option>修改</option> <option>删除</option> <option>打印</option> <option>查询</option> </select> <div style="float:left;width:15%">    <input style="width:100%" type="button" value=">" onclick="moveSelected(document.getElementById('select1'),document.getElementById('select2'))" />    <input style="width:100%" type="button" value=">>" onclick="moveAll(document.getElementById('select1'),document.getElementById('select2'))" />    <input style="width:100%" type="button" value="<" onclick="moveSelected(document.getElementById('select2'),document.getElementById('select1'))" />    <input style="width:100%" type="button" value="<<" onclick="moveAll(document.getElementById('select2'),document.getElementById('select1'))" /> </div> <select style="float:left;width:15%;height:100px" id="select2" multiple="multiple"></select></body></html>

（4）时分秒

<html><head><script type="text/javascript">    function initEvent(){        var today = new Date();        var h = today.getHours();        var m = today.getMinutes();        var s = today.getSeconds();        document.getElementById("txt").innerHTML = h+":"+m+":"+s;        //setTimeout("initEvent()", 1000);    }document.onkeyup =  function myCtrl(e){if(e.keyValue == 17)document.write("ddd");//处理ctrl键的判断条件}setInterval("initEvent()", 1000);</script></head><body onload="initEvent()">    <div id="txt"></div></body></html>

----------------------Windows Phone 7手机开发、.Net培训、期待与您交流！ ----------------------

详细请查看：http://net.itheima.com/