vue获取当前对象
<li v-for="img in willLoadImg" @click="selectImg($event)"> <img class="loadimg" :src="img.url" :data-id="img.id" alt=""> </li>
我们给li标签绑定了一个点击事件selectImg(),传入了$event对象。(这里循环遍历了一个图片数组,是为了展示更好的效果,如有需要请自行定义数组及其对应的图片,可不要只是完全复制了代码来问我为什么报错神马的)
事件方法代码:
methods: {
selectImg(event) {
console.log(event.currentTarget);
console.log(event.target);
}
}
关键在于 vue中获取当前对象的参数($event) 不能换成其他的
下面再讲一下循环遍历控件
1.js获取兄弟节点的方法:
function siblings (context) {
var siblings = [];
/*获得父节点*/
var parent = context.parentNode;
/*获得父节点的所有孩子节点*/
var childs = parent.children;
for(var i = 0; i < childs.length;i++){
if (childs[i] !== context){
siblings.push(childs[i])
}
}
return siblings ;
}
3. JQuery中的查找父节点、子节点、兄弟节点的方法:
jQuery.parent(expr) 找父亲节点,可以传入expr进行过滤,比如$("span").parent()或者$("span").parent(".class")
jQuery.parents(expr),类似于jQuery.parents(expr),但是是查找所有祖先元素,不限于父元素
jQuery.children(expr).返回所有子节点,这个方法只会返回直接的孩子节点,不会返回所有的子孙节点
jQuery.contents(),返回下面的所有内容,包括节点和文本。这个方法和children()的区别就在于,包括空白文本,也会被作为一个
jQuery对象返回,children()则只会返回节点
jQuery.prev(),返回上一个兄弟节点,不是所有的兄弟节点
jQuery.prevAll(),返回所有之前的兄弟节点
jQuery.next(),返回下一个兄弟节点,不是所有的兄弟节点
jQuery.nextAll(),返回所有之后的兄弟节点
jQuery.siblings(),返回兄弟姐妹节点,不分前后
(个人笔记仅此奉上不知道怎样才能让有需要的小伙伴看到希望你们搜对了吧)
(下一节中我会把单表增删改用SSM写出来步骤详细包含截图 从数据库到显示层全都有 感兴趣的小伙伴记得点个赞关注我)
vue获取当前对象的更多相关文章
- vue 获取时间戳对象转换为日期格式
//1. 简单页面展示用<template> <!-- time为时间戳 --> <div>{{time | formatDate}}</div> &l ...
- Vue获取dom和数据监听
Vue获取dom对象 在js和jq中我们都能获取dom对象例如 // 获取id=1的div标签 <div id=d1>dom对象</div> // js语法 let ele = ...
- vue 获取组件 和 dom 对象 ref/el
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- vue事件获取事件对象,vue获取事件源,vue event.currentTarget
js的事件,如点击事件,可以直接用this获取事件对象,而jQuery可以使用$(this)来获取事件对象.vue必须借助事件的 event 对象 的 currentTarget 才能获取事件对象 v ...
- 二、vue响应式对象
Object.defineProperty Object.defineProperty 方法会直接在一个对象上定义一个新属性,或者修改一个对象的现有属性, 并返回这个对象,先来看一下它的语法: Obj ...
- WebAPI中无法获取Session对象的解决办法
在MVC的WebApi中默认是没有开启Session会话支持的.需要在Global中重写Init方法来指定会话需要支持的类型 public override void Init() { PostAut ...
- 《Entity Framework 6 Recipes》中文翻译系列 (45) ------ 第八章 POCO之获取原始对象与手工同步对象图和变化跟踪器
翻译的初衷以及为什么选择<Entity Framework 6 Recipes>来学习,请看本系列开篇 8-6 获取原始对象 问题 你正在使用POCO,想从数据库获取原始对象. 解决方案 ...
- js和jquery获取当前对象的子元素
开发中经常遇到需要获取ul下的il对象,个人总结了js和jquery的方法. HTML片断: <ul class="box"> <li>子元素1</l ...
- 获取Graphics对象的方法
在做自定义控件时或者GDI+的时候经常会遇到获取Graphics实例的问题.一般有三种获取方式 1.从Paint事件的参数中获取.窗体和许多控件都有一个Paint事件,有一个PaintEventArg ...
随机推荐
- HDU - 3035 War(对偶图求最小割+最短路)
题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=3035 题意 给个图,求把s和t分开的最小割. 分析 实际顶点和边非常多,不能用最大流来求解.这道题要用 ...
- Jenkins实践之入门体验
官网:https://jenkins.io/ 持续集成,快速发布是DevOps实践的最好方式. 目录 准备工作 下载/安装/启动 基础配置 插件配置 构建第一个Java项目 部署项目 准备工作 在使用 ...
- 谈谈JAVA中的安全发布
谈谈JAVA中的安全发布 昨天看到一篇文章阐述技术类资料的"等级",看完之后很有共鸣.再加上最近在工作中越发觉得线程安全性的重要性和难以捉摸,又掏出了<Java并发编程实战& ...
- meterpreter基础命令大全
meterpreter meterpreter是Metasploit框架中的一个扩展模块,作为溢出成功以后的攻击载荷使用.为后渗透提供了很多便捷之处 基础命令 我们进入meterpreter之后,键入 ...
- python3 练手实例7 斐波那契数列
'''a,b=0,1 x=int(input('请指定需要多少项:')) while x>0: print(b) a,b=b,a+b x-=1''' #递归 def fibo(n): if n& ...
- “不能在dropdownlist中选择多个项
DropDownList.ClearSelection(); DropDownList.SelectedItem.Text = "value值";
- NPOI 读取excel的时候,时间格式的处理
excel的时间格式是:CellType.Numeric 要判断时间还需要方法:DateUtil.IsCellDateFormatted(cell)的帮助: 示例代码如下: ICell cell = ...
- HtmlWebpackPlugin用的html的ejs模板文件中如何使用条件判断
折腾: [已解决]给react-hot-boilerplate中的index.html换成用HtmlWebpackPlugin自动生成html 期间,已经有了思路了,但是不知道如何在ejs的html中 ...
- ABP core学习之一 使用Mysql数据库
修改项目EntityFrameworkCore的相关内容 1.添加类库 使用nuget包管理器,添加Pomelo.EntityFrameworkCore.MySql 2.TradeErpDbConte ...
- PostgreSQL对汉字按拼音排序
转自:https://www.cnblogs.com/gaojian/p/3188609.html postgres=# \l List of databases Name | Owner | Enc ...