操作元素之表单属性设置（显示隐藏表单内容） 

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>显示隐藏文本框内容</title>
    <style>
        input {
            color: #999;
        }
    </style>
</head>

<body>
    <input type="text" value="手机">
    <script>
        //1.获取元素
        var text = document.querySelector('input');
        //2.注册事件
        text.onfocus = function() {
            if (this.value === "手机") {
                this.value = "";
            }
            this.style.color = '#333';
        }
        text.onblur = function() {
            if (this.value === "") {
                this.value = "手机";
            }
            this.style.color = '#999';
        }
    </script>
</body>

onfocus获取焦点

onblur失去焦点

获取的时候是全等===（值和数据类型都一致）

赋值时候是=

posted @ 2020-04-19 22:50  wuli小迪  阅读(379)  评论(0)    收藏  举报