javascript基础

基本鼠标事件

鼠标悬浮停留事件

onmouseover
onmouseenter

他们大题没有什么区别,唯一的区别就是:mouseenter不支持冒泡,而mouseover支持冒泡。

而事件冒泡指的是事件冒泡,即在子元素上触发的事件会向上传递至父级元素,并触发绑定在父级元素上的相应事件。

鼠标离开事件

onmouseout
onmouseleave

区别同上

鼠标点击回弹事件

onmouseup

其实就是鼠标点击某个元素,然后点击完鼠标自动弹起触发的事件

鼠标点击事件

onclick
onmousedown

简单的说onclick = onmousedown + onmouseup;
如果在某个地方按下鼠标后移开鼠标在另外一个地方松开鼠标会触发onmousedown事件,但是onclick事件却不会被触发。

鼠标移动事件

onmousemove

就是鼠标在某个元素里面移动触发的事件

ommousedown和onmousemove都会产生一个鼠标的坐标值

ev.clientX 与 ev.clientY两个值,这两个值代表着鼠标在可视页面的距离X/Y的值(这里涉及到一个兼容问题,我会在后面讲到关于兼容)

获取HTML标签的方法

document.getElementById('');
这是获取拥有ID属性的HTML标签

document.getElementsByTagName('');
这是获取同一种HTML标签,里面填入的是标签的名字。它获取的元素为一组,所以用来装它的一定是数组

document.getElementsByClassName('');
这是获取类名为一样HTML标签,里面填入的是类名。它获取的元素为一组,所以用来装它的一定是数组

document.querySelector('');
这是获取一个HTML标签,里面填入的是可以是标签的名字也可以是类名甚至是ID名。如果是标签名那么直接填入。类名的话,在它前面写一个英文状态下的句号。假如是ID,那么直接在他前面添加 ' # '。它获取的元素为一组,所以用来装它的一定是数组

document.querySelectorAll('');
这是获取同一组HTML标签,获取方式同上。它获取的元素为一组,所以用来装它的一定是数组

前三组和后两组的区别

后两组选出来的元素及元素数组是静态的,而前三组这种方法选出的元素是动态的。静态的就是说选出的所有元素的数组,不会随着文档操作而改变。
在使用的时候前三组这种方法性能比较好,后两组则比较方便。

函数

function a(xxx,xxxx){
xxxx;
xxxxx;
xxxx;
}

function  是每写一个函数都要写的,就像提名一样。

a  是函数的名字,这个是你自己取的,当然有的函数则不需要函数名因为他是直接赋值给前面的。

a.onclick = function(){
xxxxx;
xxxxxx
}
例如上面的就直接赋予前面的a的点击事件,就可以省略给函数取名这一步

()  则是你需要传递进去的参数

{}  里面是你这个函数具体要实现什么样的操作,记住写完一句之后记得用 ;结尾,最后一句则可以省略。
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • 1.HTML DOM (Document Object Model) document.getElementByI...
    廖马儿阅读 1,610评论 0 17
  • 转载请声明出处 博客原文 随手翻阅以前的学习笔记,顺便整理一下放在这里,方便自己复习,也希望你有也有帮助吧 第一课...
    前端进阶之旅阅读 12,973评论 13 94
  •   JavaScript 与 HTML 之间的交互是通过事件实现的。   事件,就是文档或浏览器窗口中发生的一些特...
    霜天晓阅读 3,715评论 1 11
  • 闲余之际整理了一些Js初级词汇,分享于大家,现炮制如下: 一.数组 1检测 arr.isArray(要判断的变量)...
    予以暖杀风阅读 688评论 0 2
  • 开头:幸福应该有多少种颜色呢? 结尾:享受快乐。是一种怯懦。享受快乐,是一种学习。
    公子白洛阅读 472评论 0 0

友情链接更多精彩内容