首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往
您找到你想要的搜索结果了吗?
是的
没有找到

准确获取事件源的任意元素(事件委托)

通常我们都会使用事件源e.target来获取点击的元素,从而可以知道我们点击的是谁。...当我们处理的结构是像这样简单的ul > li时,这种方法就非常好用,e.target获取到的事件源就是li 1 2...需要实现的功能是,点击这个盒子区域,输出对应的li对应的id,下面是这个li对应的代码片段,很显然在li内部存在着大量的子元素,我们需要通过给li的元素ul绑定事件,从而实现事件委托,那么我们该如何确定我们点击的元素属于哪一个...li了,从而导致我们获取不到id无从下手 解决方法 下面我通过另一种方法很好的解决了这个问题 在我们的事件对象event中,存在着一个方法path,这个方法可以返回事件触发的所有元素,我们可以使用这个方法...e.path返回的数组中是否含有这个属性,从而来确定事件触发元素的li,进而解决了我们的问题 注意:localName属性是确定元素的标签,像div li这些就属于localName,整个方法的核心就是通过获取到触发事件元素的所有元素集合

2.5K30

JS和JQuery获取当前元素的兄弟及等元素的方法

) jQuery.parents(expr),类似于 jQuery.parents(expr) ,但是是查找所有祖先元素,不限于元素 jQuery.children(expr),返回所有子节点,这个方法只会返回直接的孩子节点...: var chils= s.childNodes;  //得到s的全部子节点 var par=s.parentNode;   //得到s的节点 var ns=s.nextSibling;   //获得...s.previousSibling;  //得到s的上一个兄弟节点 var fc=s.firstChild;   //获得s的第一个子节点 var lc=s.lastChild;   //获得s的最后一个子节点 JS获取节点...,子元素:JS的方法会比JQUERY麻烦很多,主要则是因为FF、谷歌浏览器会把你的换行也当作DOM元素:空的text元素,目前IE也是这样   ...   原生的JS获取ID为test的元素下的子元素。

12.4K10

vue组件调用子组件属性_vue子组件获取组件实例

在vue2中,子组件调用组件,直接使用this.$emit()即可。 但是在vue3中,很显然使用this.$emit() 已经开始报错了,为什么会报错呢?...那么我们在vue3中,子组件该如何调用组件的函数呢? 方法一: 首先写一个 Child.vue,重点在 setup 函数中引入 context 形参,配合 emit 使用。...定义了两个函数,toFatherNum(), toFatherObject() 分别向组件传递数字和对象 子传数字... 方法二: 1.在子组件里引入useContext import { useContext } from "vue"; 2.获取上下文...const ctx = useContext(); 3.在需要调用组件的地方写上下面的代码进行调用 ctx.emit(‘fatherMethod’); //fatherMethod 是想要调用组件的一个方法

2K20

vue组件操作子组件的方法_vue组件获取子组件数据

组件和子组件 我们经常分不清什么是组件,什么是子组件。现在来简单总结下:我们将某段代码封装成一个组件,而这个组件又在另一个组件中引入,而引入该封装的组件的文件叫做组件,被引入的组件叫做子组件。...当我们创建了组件和子组件,如果子组件也想获取组件上相同的数据,一种方法是像后台发送接口获取数据,但是这样会给服务器造成压力,所以我们有了第二种方法,通过props属性来获取组件的数据 <div...,又定义了子组件test1,此时子组件test1想获取组件data中的数据来展示在页面上,就需要写入props属性,这里绑定了变量cmovies,最后我们在html中使用子组件test1时,想传入组件...props定义成为了一个数组,用于接收来自组件的数据。...子传的场景,通常是子组件传递事件给组件监听,告诉组件用户点击了哪个按钮,使用的函数是$emit vm.

6.9K10
领券