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 ...
随机推荐
- DirectX11--HLSL编译着色器的三种方法
前言 本教程不考虑Effects11(FX11),而是基于原始的HLSL. 目前编译与加载着色器的方法如下: 使用Visual Studio中的HLSL编译器,随项目编译期间一同编译,并生成.cso( ...
- 配置rpm包安装的jdk环境变量
最近在搭建james邮件服务的时候,由于这个服务是用Java开发的,之前这台服务器跑过tomcat服务,故有Java环境,就没在意有无配置环境变量,但在启动james的时候报没有配置环境变量: 那么问 ...
- shell 生成任意大小文件
$ dd if=/dev/zero of=junk.data bs=1M count=1 参数: if (input file) of (output file) bs(block size) co ...
- python中opencv的安装
1.得到opencv的安装包: 2.把安装包中的cv.py, cv2.pd放到一个文件夹中,并把这个文件夹放到D:\Anaconda2\Lib\site-packages中: 3.添加新的变量,变量名 ...
- mysql,mycat的demo
一直都是使用公司架构师提供的mycat,今天得空自己尝试了以下: 1.首先安装jdk(官网建议1.7及以上版本),mysql(我安装的是5.7.19-0ubuntu0.16.04.1,设置账号密码为r ...
- Python+Selenium+Unittest+HTMLTestRunner生成测试报告+发送至邮箱,记一次完整的cnblog登录测试示例,
测试思路:单个测试集.单个测试汇成多个测试集.运行测试集.生成测试报告.发送至邮箱. 第一步:建立单个测试集,以cnblog登录为例. 测试用例: cnblog的登录测试,简单分下面几种情况:(1)用 ...
- web前端效率提升之浏览器与本地文件的映射-遁地龙卷风
1.chrome浏览器,机制是拦截url, 1.在浏览器Element中调节的css样式可以直接同步到本地文件,反之亦然,浏览器会重新加载css,省去刷新 2.在source面板下对js的编辑可以同步 ...
- Spring Cloud 2-Config 分布式配置中心(七)
Spring Cloud Config 1.github配置 2.服务端配置 pom.xml application.xml Application.java 3.配置和命名 1. 配置加载顺序 ...
- *42. Trapping Rain Water 接雨水
1. 原始题目 给定 n 个非负整数表示每个宽度为 1 的柱子的高度图,计算按此排列的柱子,下雨之后能接多少雨水. 上面是由数组 [0,1,0,2,1,0,1,3,2,1,2,1] 表示的高度图,在这 ...
- 收集Typecho 0.9还能用的插件
收集Typecho 0.9还能用的插件 名称 描述 版本 作者 BaiduSubmit 百度结构化插件 for Typecho 0.5.2 老高 CateFilter 首页过滤指定分类 1.2.1 R ...