zepto

WebApp开发-Zepto

由 故事扮演 提交于 2020-01-08 15:52:01
zepto.js自己去官网下载哈。 DOM操作 $(document).ready(function(){ var $cr = $("<div class='cr'>插入的div</div>"); // 插入操作 $("#a").append($cr); $cr.appendTo($("#a")); $("#a").prepend($cr); $cr.prependTo($("#a")); $("#a").after($cr); $cr.insertAfter($("#a")); $("#a").before($cr); $cr.insertBefore($("#a")); // 删除 remove\empty $("ul li").remove(); $("ul li").empty(); // 复制节点 $("ul li").click(function(){ $(this).clone().appendTo("ul"); }); // 替换节点 replaceWith $("p").replaceWith("<span>是的，哈哈</span>"); // 包裹节点 wrap wrapAll $("p").wrap("<div></div>"); $("p").wrapAll("<div></div>"); }); 属性与样式操作 $(document).ready

Uncaught TypeError in jQTouch

由 匆匆过客 提交于 2020-01-06 10:22:02
问题 I am trying to use the swipe event in jQtouch . For that purpose, i have a code which uses latest jQtouch.js . But, when i try to initialize this, i get this error in my browser console : Uncaught TypeError: undefined is not a function The error is present here in this line : var jQT = new $.jQTouch({ }); However, if i do not use this line , then the swipe event does not work, since, jQtouch dose not get initialized. I have no idea how to solve this . Any help will be appreciated ! 回答1: Try

Uncaught TypeError in jQTouch

由 懵懂的女人 提交于 2020-01-06 10:21:33
问题 I am trying to use the swipe event in jQtouch . For that purpose, i have a code which uses latest jQtouch.js . But, when i try to initialize this, i get this error in my browser console : Uncaught TypeError: undefined is not a function The error is present here in this line : var jQT = new $.jQTouch({ }); However, if i do not use this line , then the swipe event does not work, since, jQtouch dose not get initialized. I have no idea how to solve this . Any help will be appreciated ! 回答1: Try

iOS/Android browser: showing a zoomed preview of button on touchmove

由 筅森魡賤 提交于 2020-01-06 07:20:46
问题 I'm trying to create behavior similar to iPhone keyboard (see included image). As in, when user starts and moves touch, she sees a zoomed version of the element that is touched, and selection would happen when on touch up. I'm using Zepto. I can get the touch coordinates correctly, but have trouble finding the object that's under the finger. I'm using below code to check which element is returned as target of the event. $("#myList li").live('touchmove', function(event) { console.log(event

原型和原型链（jquery为例子）

由 纵然是瞬间 提交于 2020-01-03 05:12:46
首先，我们先看下jQuery是怎么用的，如下: let a = $('p'); a.css('color', 'red'); a.html(); a.value(); 简单实现zepto原型： var zepto = {}; zepto.init = function (selector) { var slice = Array.prototype.slice; var dom = slice.call(document.querySelectorAll(selector)); return zepto.Z(dom, selector); } function z(dom, selector) { var i, length = dom ? dom.length : 0 for (i = 0; i < length; i++) { this[i] = dom[i]; } this.length = length; this.selector = selector || ''; } //构造函数 zepto.Z = function (dom, selector) { return new z(dom, selector); } var $ = function (selector) { return zepto.init(selector); } $.fn = { css:

View event listeners - Javascript

由 那年仲夏 提交于 2020-01-01 04:21:06
问题 I'm wondering if it is possible to view 1. How many event listeners 2. What type of event listener On a single web page. Reason being is becuase im using off(); method. I'm using this framework , which is basically jQuery but not. Yeah, I'm using off but the even't isn't removing and and I have a feeling there is more than one eventListener on the element. If it is not possible with javascript, it is possible in the browser? 回答1: Chrome has some built in tools. If you open up the element

What's the Zepto equivalent of jQuery.getScript()?

由 社会主义新天地 提交于 2020-01-01 03:41:03
问题 What's the Zepto equivalent of jQuery.getScript()? I need to dynamically load a JavaScript file with both libraries. 回答1: This works appended to zepto.js! ;(function ($) { $.getScript = function(src, func) { var script = document.createElement('script'); script.async = "async"; script.src = src; if (func) { script.onload = func; } document.getElementsByTagName("head")[0].appendChild( script ); } })($) 回答2: ;(function($){ $.getScript = function (url, success, error) { var script = document

读 Zepto 源码之集合元素查找

由 烈酒焚心 提交于 2019-12-31 12:41:48
这篇依然是跟 dom 相关的方法，侧重点是跟集合元素查找相关的方法。 读Zepto源码系列文章已经放到了github上，欢迎star: reading-zepto 源码版本 本文阅读的源码为 zepto1.2.0 内部方法 之前有一章《 读Zepto源码之内部方法 》是专门解读 zepto 中没有提供给外部使用的内部方法的，但是有几个涉及到 dom 的方法没有解读，这里先将本章用到的方法解读一下。 matches zepto.matches = function(element, selector) { if (!selector || !element || element.nodeType !== 1) return false var matchesSelector = element.matches || element.webkitMatchesSelector || element.mozMatchesSelector || element.oMatchesSelector || element.matchesSelector if (matchesSelector) return matchesSelector.call(element, selector) // fall back to performing a selector: var match,

读zepto核心源码学习JS笔记(4)--$.fn

由 只谈情不闲聊 提交于 2019-12-31 12:41:31
根据第一篇整体框架,可以知道$()方法返回的Z函数的实例化;而Z的原型又指向$.fn;所以经过$()处理过的对象,都可以使用$.fn中的方法; 这一篇就记录一下读$.fn的笔记; zepto.Z.prototype = Z.prototype = $.fn 一 内部函数 zepto.match //判断一个元素是否匹配给定的选择器 zepto.matches = function(element, selector) { //如果selector,element没值或者element是普通节点 if (!selector || !element || element.nodeType !== 1) return false var matchesSelector = element.matches || element.webkitMatchesSelector || element.mozMatchesSelector || element.oMatchesSelector || element.matchesSelector if (matchesSelector) return matchesSelector.call(element, selector) // fall back to performing a selector: var match, parent =

61原生JS：拖拽

由 我是研究僧i 提交于 2019-12-27 05:43:58
```html:run<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>拖拽</title> <style> *{ margin:0; padding:0; } div{ position: absolute; left:0; top:0; width: 100px; height: 100px; background: red; } </style></head><body><div id="div"></div><script> var oDiv=document.getElementById('div'); oDiv.onmousedown=down; function processThis(fn,obj){ return function(e){ fn.call(obj,e) } } function down(e){ e=e||window.event; this.x=this.offsetLeft; this.y=this.offsetTop; this.mx= e.clientX; this.my= e.clientY; if(this.setCapture){ this.setCapture(); this.onmousemove=processThis(move,this);
订阅 zepto