javascript的dom操作

javascript的dom操作(2)

时间：2023-12-13 13:25:53 来源：IT袋作者：马勇

导读：javascript的dom操作，onblur 元素失去焦点 onfocus 元素获得焦点 onload 某个页面或图像被完成加载 onsubmit 当表单提交时触发该事件 onkeydown 某个键盘的键被按下 onmouseover 鼠标被移

javascript的dom操作

onblur元素失去焦点onfocus元素获得焦点onload某个页面或图像被完成加载onsubmit当表单提交时触发该事件onkeydown某个键盘的键被按下onmouseover鼠标被移到某元素之上onmouseout鼠标从某元素移开

3.3、设置事件的两种方式

方式一：命名函数

通过标签中的事件属性进行绑定

<button type="button" onclick="函数名()"></button>
<script>
    // 命名函数设置事件
    function abc(){
        alert("你点我了")
    }
</script>

方式二：匿名函数

通过 DOM 元素属性绑定

<input type="button" id="btn">
<script>
    // 匿名函数设置失去焦点的事件
    document.getElementById("btn").onclick = function (){
        alert("我被点了")
    }
</script>

3.4、事件案例

当输入用户名时显示正在输入，离开时显示请输入

javascript的dom操作

案例代码

用户名: <input id="in1" name="user"><span id="sp1">请输入</span>
<script>
    document.getElementById("in1").onfocus = function (){
        document.getElementById("sp1").innerHTML = "正在输入"
    }
    document.getElementById("in1").onblur = function (){
        document.getElementById("sp1").innerHTML = "请输入"
    }
</script>

上述的关于javascript的dom操作的经验介绍，您知道和解决您袋问题了吗？