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

js原生拖拽两种方法

大家好,又见面了,我是你们朋友全栈君。...2、绑定拖拽元素,移动和鼠标松开后是对document绑定,因为移动是整个div。 3、点击:a= 获取当前鼠标坐标、b =div距浏览器距离、c = 鼠标在div内部距离=a-b。...dragover事件 离开目标元素,触发dragleave事件(类比mouseout) 若拖放元素到了目标元素(在目标元素松开鼠标),就会触发drop事件而不会触发dragleave事件...事件取消默认事件就可以解决问题 数据交换 数据交换对象就是事件对象属性dataTransfer dataTransfer两个核心方法是setData()和getData() setData...e.target.appendChild(document.getElementById(data)); } } 拖拽设置 在dataTransfer还有两个重要属性

2.8K30

JSindexOf方法

大家好,又见面了,我是你们朋友全栈君。 indexOf()简介 indexOf()是js内置方法之一,它功能大家都很熟悉:简单来说就是得到数据索引,对于正则不熟练的人,是个很不错方法。...) 注:(暂不讨论两个参数时(第二个参数为查询起始位置),以及lastIndexOf()) String类型使用indexOf(); StringindexOf方法 (话不多说直接上代码,不跟你多...()是对数据进行了隐式类型转换,如果参数是数值它会转换为字符来进行查询然后返回索引,本质原因是什么呢,那就是 我们js底层代码String.prototype.indexOf()使用是==进行比较判断...; Number类型IndexOf() 醒醒,Number类型哪来indexOf()方法,会直接报错好吗, 如果想对数值类型进行查询索引,可以将数值转换为字符再进行查询,方法有很多: –...()是不会进行隐式类型转换,也就是说Array.prototype.indexOf()底层代码在实现时候使用是强等于=== 严格比较; 总结 stringindexOf() 会将数值参数转换为字符再查询索引

5.1K40

原生js笔记

引入Javascript 方式有三种 1.在html 中直接放到 2.外部引入js文件 3.在标签直接写 <p...全局作用域: 在js作用域: 一个变量作用范围 1、全局作用域(整个 标签): 页面打开全局作用域被打开,页面关闭全局作用域被销毁; 全局作用域变量叫全局变量,全部变量可以在全局作用域中使用...指向 window 整个页面的 2、在对象属性方法调用 this指向调用这个方法对象。...* 2.将新建对象设置为函数this,在构造函数可以使用this来引用新建对象 * 3.逐行执行函数代码 * 4.将新建对象作为返回值返回 * 使用同一个构造函数创建对象,我们称为一类对象...* 我们将通过一个构造函数创建对象,称为是该类实例 * this情况: * 1.当以函数形式调用时,this是window,默认就是window * 2.当以方法形式调用时,谁调用方法this

5910

【CSS进阶】原生JS getComputedStyle等方法解析

另外,阅读源码让我接触到了大量底层知识。对原生JS 、框架设计、代码优化有了全新认识,接下来将会写一系列关于 jQuery 解析文章。...我在 github 上关于 jQuery 源码全文注解,感兴趣可以围观一下。jQuery v1.10.2 源码注解 。 言归正传,本文讲的是原生 JS 获取、设置元素最终样式方法。...原生JS实现CSS样式get与set 说了这么多,接下来将用原生 JS 实现一个小组件,实现 CSS get 与 set,兼容所有浏览器。...elem.style.cssText += ';' + (style + ":" + value); } 到这里,原生 JS 实现 getStyle 与 setStyle 就实现了,完整代码可以戳这里查看...jQuery 这样框架可以帮助我们走更快,但是毫无疑问,去弄清底层实现,掌握原生 JS 写法,可以让我们走得更远。 原创文章,文笔有限,才疏学浅,文中若有不正之处,万望告知。

1.5K50

原生JSAjax

转自:https://www.cnblogs.com/yufann/p/JS-Ajax.html 1.创建一个Ajax对象       非IE6浏览器:var obj = new XMLHttpReuqest...Date().getTime(),true); 3.发送请求          obj.send(); 4.接收返回值           请求状态监控:onreadystatechange事件:当自己Ajax...----readyState属性:请求状态                    0(未初始化)还没有调用send()方法                    1(载入)已经调用了send()方法,正在发送请求...                   2(载入完成)send()方法执行完成,已经接收到全部响应内容                    3(交互)正在解析响应内容                    ...---返回值responseText:从服务器返回文本:obj.responseText(返回为字符串)  GET方式 function getAjax(){ var obj

11.1K20

input获取焦点 原生js_原生jsinput事件

大家好,又见面了,我是你们朋友全栈君。...1.onfocus 当input 获取到焦点时触发 2.onblur 当input失去焦点时触发,注意:这个事件触发前提是已经获取了焦点再失去焦点时候才会触发该事件,用于判断标签为空。...4.onkeydown 按下按键时事件触发, 5.onkeyup 当按键抬起时候触发事件,在该事件触发之前一定触发了onkeydown事件–相当于一个按键,两个事件,没怎么用过 6.onclick...主要是用于 input type=button,input作为一个按钮使用时鼠标点击事件 7.onselect 当input里内容文本被选中后执行,只要选择了就会触发,不是全部选中 8.oninput...当inputvalue值发生变化时就会触发,(与onchange区别是不用等到失去焦点就可以触发了) 使用方法: 以上事件可以直接放到input属性里,例如: 1 , 可以通过js给input

25.3K60

js数组splice方法_vuesplice方法

大家好,又见面了,我是你们朋友全栈君。 JavaScriptsplice主要用来对js数组进行操作,包括删除,添加,替换等。...1.删除-用于删除元素,两个参数,第一个参数(要删除第一项位置),第二个参数(要删除项数) 2.插入-向数组指定位置插入任意项元素。...三个参数,第一个参数(插入位置),第二个参数(0),第三个参数(插入项) 3.替换-向数组指定位置插入任意项元素,同时删除任意数量项,三个参数。...第一个参数(起始位置),第二个参数(删除项数),第三个参数(插入任意数量项) 示例: 1、删除功能,第一个参数为第一项位置,第二个参数为要删除几个。...如发现本站有涉嫌侵权/违法违规内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

3.8K10

js书写原生ajax,JS 原生ajax写法

原生ajax 原文链接:http://caibaojian.com/ajax-jsonp.html 一.JS原生ajax ajax:一种请求数据方式,不需要刷新整个页面: ajax技术核心是 XMLHttpRe...… JS原生ajax与Jquery插件ajax深入学习 序言: 近来随着项目的上线实施,稍微有点空闲,闲暇之时偶然发现之前写关于javascript原生xmlHttpRequest ajax方法以及后来...jquery插件ajax方法,于是就行了一些总结,因 … js原生Ajax封装与使用 一.原生Ajax代码封装如下: (function() { var XHR = { createStandardXHR...删除用户,使用了js原生ajax 主要复习了phppdo数据库操作,和jsajax,真麻烦,希望jqueryajax简单点. index.php: 1 2 [代码]JS原生...Ajax,GET和POST javascript/jsajaxGET请求: Jquery学习笔记(10)–ajax删除用户,使用了js原生ajax 主要复习了phppdo数据库操作,

15.3K40

JS数组方法

JS数组方法总结 Array.push() 向数组末尾添加一个或者多个元素,并返回新长度 let arr =[1,2,3]; console.log(arr.push(6)) //打印结果为...(arr) //打印结果 [1,a] Array.slice(a,b) 将数组一部分选取出来并返回成新数组,不改变原数组,不包括结束位置。...(arr) //打印结果 [1,2,3,4] Array.concat(arr1,arr2) 连接2个或者更多数组,并返回连接后新数组,该方法不会改变原数组 let arr1 = [1,2,3...this指向,因此如果想用thisValue参数必须使用function函数 Array.map() 对数组每个元素进行重新编辑,返回用编辑结果组成新数组,传递参数和forEach()一样...) //结果 2 Array.findIndex() 返回数组符合条件第一个元素下标,若数组没有元素符合要求则返回-1,不改变原数组 let arr = [1,2,3] console.log

6.2K21
领券