JS简介，js事件语法、鼠标移入和移出事件类型

最新推荐文章于 2023-09-18 23:22:15 发布

好好学习昂

最新推荐文章于 2023-09-18 23:22:15 发布

阅读量1.1k

点赞数 1

分类专栏：软件测试学习笔记 # 阶段1测试基础文章标签： js

本文链接：https://blog.csdn.net/m0_46442882/article/details/119645280

版权

软件测试学习笔记同时被 2 个专栏收录

37 篇文章 1 订阅

订阅专栏

阶段1测试基础

17 篇文章 0 订阅

订阅专栏

JS简介

js诞生于1995年，但是主要目的是解决表单数据的合法性验证
JavaScript：简写js，于java无关
控制web前端标准的前两者，结构和样式

<script>
    // alert弹出对话框，小括号里面的的内容，单引号和双引号都可以
    // ctrl+?还是注释的快捷键
    // 最后的；不推荐省略
    alert();
    alert('你的余额不足');
    alert("你的网费不足");
</script>

js事件语法

<body>
    <input type="button" value="点击" id="dj">
    <input type="button" value="好好" class="hh">
    <input type="button" value="学习" class="xx">
    <input type="button" value="天天" class="tt">
    <input type="button" value="向上" class="xs">


</body>


<script>
    // 事件三要素：
    //事件的语法规则
    // 事件源.事件类型=function（）{
        //事件发生的时候，要执行的命令 }
    
    // document 代表查找的范围在整个文档中
    // getElementById 获取元素，用id找
    //onclick 代表事件类型（鼠标左键点击)
    // function（）{要执行的命令}
    document.getElementById('dj').onclick=function(){
        alert('恭喜你，中奖了！！！')
    }
    // document.getElementsByClassName('dj')  找class为dj的标签
    // onclick必须是小写
    // [数字] 代表第几个，从0开始记录数字（索引值、地址）
    document.getElementsByClassName('hh')[0].onclick=function(){
        alert("一定好好学习哦")
    }

    // document.getElementsByClassName('xx')[1].onclick=function(){
    //     alert("一定好好学习哦")
    // }

</script>

鼠标移入和移出事件类型

<body>
    <input type="button" value="点击" id="dj">
    <input type="button" value="好好" class="hh">
    <input type="button" value="学习" class="xx">
    <input type="button" value="天天" class="tt">
    <input type="button" value="向上" class="hh">
</body>
<script>
    // 事件三要素：
    //事件的语法规则
    // 事件源.事件类型=function（）{
        //事件发生的时候，要执行的命令 }
    
    // document 代表查找的范围在整个文档中
    // getElementById 获取元素，用id找
    //onclick 代表事件类型（鼠标左键点击)
    // function（）{要执行的命令}
    document.getElementById('dj').onclick=function(){
        alert('恭喜你，中奖了！！！')
    }
     
    // document.getElementsByClassName('dj')  找class为dj的标签
    // onclick必须是小写
    // [数字] 代表第几个，从0开始记录数字（索引值、地址）
    document.getElementsByClassName('hh')[0].onclick=function(){
        alert("好好学习哦")
    }

    // onmouseover 鼠标移入
    document.getElementsByClassName('xx')[0].onmouseover=function(){
        alert("鼠标移入会弹出")
    }
	//onmouseout 鼠标移出
    document.getElementsByClassName('tt')[0].onmouseout=function(){
        alert("鼠标移出会弹出")
    }
    // 相同的名字，数字需要写1，前面数字里面都是写0，因为class不一样，都是第一次所以写0
    document.getElementsByClassName('hh')[1].onclick=function(){
        alert("好好学习哦ooooooo")
    }
</script>

好好学习昂

关注

1
点赞
踩
3

收藏

觉得还不错? 一键收藏
0
评论
JS简介，js事件语法、鼠标移入和移出事件类型

JS简介js诞生于1995年，但是主要目的是解决表单数据的合法性验证JavaScript：简写js，于java无关控制web前端标准的前两者，结构和样式<script> // alert弹出对话框，小括号里面的的内容，单引号和双引号都可以 // ctrl+?还是注释的快捷键 // 最后的；不推荐省略 alert(); alert('你的余额不足'); alert("你的网费不足");</script>js时间语法.
复制链接

扫一扫

专栏目录