js复习之-dom编程[常用代码]-优快云博客

本文介绍了一系列实用的网页交互技术，包括页面刷新、跑马灯效果实现、鼠标位置追踪、事件对象获取、文本复制及权限控制等。同时探讨了表单元素如单选框和复选框的操作方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

刷新
        function red() {
            window.location.reload();
        }

跑马灯，定时器
		var trmid1;
        var trmid2;
        function lf() {
            if (trmid2) {
                clearInterval(trmid2);
            }
            trmid1 = setInterval(function () {
                var title = document.title;
                var first = title.substr(0, 1);
                var last = title.substr(1);
                document.title = last + first;

            }, 500);
        }
        function ri() {
            if (trmid1) {
                clearInterval(trmid1);
            }
            trmid2 = setInterval(function () {
                var title = document.title;
                var first = title.substr(title.length - 1, 1);
                var last = title.substr(0, title.length - 1);
                document.title = first + last;

            }, 500);
        }

如果按下哪个键（这个方法都支持，还有一种IE特有的就不记了）
       <span id="Span1" onclick="span_ck1(event)">FF下的超链接</span>
       function span_ck1(e) {
            if (e.altKey) {
                alert("456");
            }
        }

鼠标的三种位置
		        document.onmousemove = function () {
                //鼠标在文件档上的位置
                document.title = window.event.clientX + "==" + window.event.clientY;

               //鼠标在屏幕上的位置
               document.title = window.event.screenX + "==" + window.event.screenY;

               //鼠标在容器上的位置
               document.title = window.event.offsetX + "==" + window.event.offsetY;
        }

获得事件的对像
var btn = window.event.srcElement;

复制
        function fz() {
            var t = document.getElementById("txt").value;
            window.clipboardData.setData("text", t);
        }

复制加版权
        function nocopy() {
            var t = clipboardData.getData("text");
            t = "版权所有：http://" + t;
            clipboardData.setData("text", t);
        }
		<body oncopy="setTimeout('nocopy()',10)"> 注意这里才生效

<input type="text" name="name" id="txt1" value=" " oncopy="alert('禁址复制');return false" oncut="alert('禁址剪切');return false" ondrag="return false"/>

增加多个方法
document.addEventListener("click", ff);


单选，多选，全选，反选
        //获取radios值
        function f2() {
            var radios = document.getElementsByName("r");
            for (var i = 0; i < radios.length; i++) {
                if (radios[i].checked) {
                    alert(radios[i].value);
                    break;
                }
            }
        }
        //获取checkbox值
        function f3() {
            var ches = document.getElementsByName("chb");
            var str="";
            for (var i = 0; i < ches.length; i++) {
                if (ches[i].checked) {
                    str += ches[i].value + ",";
                }
            }
            if (str.length > 0) {
                str = str.substr(0, str.length - 1);
            }

            alert(str);
        }

        //全选反选 按扭
        function f4() {
            var ches = document.getElementsByName("chb");
            for (var i = 0; i < ches.length; i++) {
                ches[i].checked = !document.getElementById("chbck").checked;
            }
            document.getElementById("chbck").checked = !document.getElementById("chbck").checked;

        }

        //全选反选 checkbox
        function f5() {
            var ches = document.getElementsByName("chb");
            for (var i = 0; i < ches.length; i++) {
                ches[i].checked = document.getElementById("chbck").checked;
            }
        }

        //注册当其中有一个没有选中时
        window.onload = function () {
            var ches = document.getElementsByName("chb");
            for (var i = 0; i < ches.length; i++) {
                ches[i].onclick = function () {
                    var flag = true;
                    for (var j = 0; j < ches.length; j++) {
                        if (!ches[j].checked) {
                            flag = false;
                        }
                    }
                    document.getElementById("chbck").checked = flag;
                }
            }
        }