一些常用的JS函数
//获取元素属性
function getStyle(obj, attr) {
return obj.currentStyle ? obj.currentStyle[attr] : getComputedStyle(obj, 0)[attr];
}
//运动函数
function doMove(obj, attr, speed, target, endFn) {
clearInterval(obj.timer);
speed = parseInt(getStyle(obj, attr)) < target ? speed : -speed;
//alert(speed);
obj.timer = setInterval(function () {
var curPosition = parseInt(getStyle(obj, attr)) + speed;
if (curPosition > target && speed > 0 || curPosition < target && speed < 0)
curPosition = target;
obj.style[attr] = curPosition + 'px';
if (curPosition == target) {
clearInterval(obj.timer);
endFn && endFn();
} }, 50); }
//抖动函数
//透明度渐变函数
//需找与数组相等的值函数
function arrIndexOf(arr, v) {
for (i = 0; i < arr.length; i++) {
if (arr[i] == v) {
return i; //返回与目标值相等的数组的下标值
}
}
return -1;
}
//getElementByClassName函数
function getElementByClassName(parent, tagName, className) {
var aEls = parent.getElementsByTagName(tagName);
var arr = [];
for (var i = 0; i < aEls.length; i++) {
var arrClassName = aEls[i].className.split(' ');
var _index = arrIndexOf(arrClassName, className);
if (_index != -1) {
arr.push(aEls[i]);
}
}
return arr;
}
//addClass函数
function addClass(obj, className) {
if (obj.className == '') {
//如果原来没有class
obj.className = className;
}
else {
var arrClassName = obj.className.split(' ');
var _index = arrIndexOf(arrClassName, className);
if (_index == -1) {
//如果要添加的class在原来的class中不存在
obj.className += ' ' + className;
}
//如果要添加的class在原来的class中存在,则不需要做任何事
}
}
//removeClass函数
function removeClass(obj, className) {
//如果原来有class
if (obj.className != '') {
var arrClassName = obj.className.split(' ');
var _index = arrIndexOf(arrClassName, className);
if (_index != -1) {
arrClassName.splice(_index, 1); //删除需要删除的calss
obj.className = arrClassName.join(' '); //然后将arrClassName数组拼接起来
}
}
}
//绑定事件函数
function bind(obj, evname, fn) {
if (obj.addEventListener) {
obj.addEventListener(evname, fn, false);
} else {
obj.attachEvent('on' + evname, function () {
fn.call(obj); //fn()==fn.call() call(第一个参数,第二个参数) call函数可以改变函数this的指向,call函数传入的第一个参数就是改变this指向的值,call的第二第三个参数就是原函数的参数
});
}
}
//鼠标在可视区域内的拖拽 不兼容非标准IE
function clientDrag(obj) {
obj.onmousedown = function (ev) {
ev = ev || event;
var ms_b = ev.clientX - obj.offsetLeft;
var ms_t = ev.clientY - obj.offsetTop;
document.onmousemove = function (ev) {
ev = ev || event;
var currX = ev.clientX - ms_b;
var currY = ev.clientY - ms_t;
var Width = document.body.clientWidth || document.documentElement.cilentWidth;
var Height = document.body.clientHeight || document.documentElement.cilentHeight;
if (currX < 0) { currX = 0; }
else if (currX > Width - obj.clientWidth) {
currX = Width - obj.clientWidth;
}
if (currY < 0) { currY = 0; }
else if (currY > Height - obj.clientHeight) {
currY = Height - obj.clientHeight;
}
obj.style.left = currX + 'px';
obj.style.top = currY + 'px';
return false;
}
document.onmouseup = function () {
document.onmousemove = document.onmouseup = null;
}
}
}
一些常用的JS函数的更多相关文章
- 工作中常用的JS函数整理分享(欢迎大家补充)
今年在渣X工作整理的常用JS函数 今年来了渣X工作,我所在这个部门分工很奇怪,CSS竟然有专门的人在搞,开发PHP的人员需要处理JS,以至于有时候开发起来不是那么得心应手,感觉把JS和CSS拆开就像是 ...
- 常用原生JS函数和语法集合
luoyishan-2017-10-08 1. 输出语句:document.write(""); 2. JS中的注释为// 3. 传统的HTML文档顺序是:document-> ...
- 常用的js函数
function $(){ return document.getElementById(arguments[0])}; /** * 得到上一个元素 * @param {Object} elem */ ...
- 100多个基础常用JS函数和语法集合大全
网站特效离不开脚本,javascript是最常用的脚本语言,我们归纳一下常用的基础函数和语法: 1.输出语句:document.write(""); 2.JS中的注释为//3.传统 ...
- (转)在网页中JS函数自动执行常用三种方法
原文:http://blog.sina.com.cn/s/blog_6f6b4c3c0100nxx8.html 在网页中JS函数自动执行常用三种方法 在网页中JS函数自动执行常用三种方法 在HTML中 ...
- 原生JS研究:学习jquery源码,收集整理常用JS函数
原生JS研究:学习jquery源码,收集整理常用JS函数: 1. JS获取原生class(getElementsByClass) 转自:http://blog.csdn.net/kongjiea/ar ...
- api日常总结:前端常用js函数和CSS常用技巧
我的移动端media html{font-size:10px} @media screen and (min-width:321px) and (max-width:375px){html{font- ...
- web前端关于html转义符的常用js函数
web前端关于html转义符的常用js函数 //去掉html标签 function removeHtmlTab(tab) { return tab.replace(/<[^<>]+? ...
- 基础常用JS函数和语法
100多个基础常用JS函数和语法集合大全 来源:http://www.cnblogs.com/hnyei/p/4605103.html 网站特效离不开脚本,javascript是最常用的脚本语言,我 ...
随机推荐
- windows查询端口
依次点击“开始→运行”,键入“cmd”并回车,打开命令提示符窗口.在命令提示符状态下键入“netstat -an”,按下回车键后就可以看到以数字形式显示的TCP和UDP连接的端口号及状态.
- Nginx学习之三-ngx_http_request_t结构体
ngx_http_request_s是nginx中非常重要的一个结构体,贯穿于htpp请求处理的整个过程中. 下面解释了ngx_http_request_s结构体中与HTTP框架相关的重要的成员变量. ...
- 观察者模式模拟YUI事件机制
首先介绍下YUI的事件机制,很好理解,因为和浏览器事件机制差不多.看懂下面几个方法就可以了: publish: 创建自定义事件.第一个参数是事件类型,第二个参数是一个对象,里面可以设置默认动作 on: ...
- C链表之创建简单静态链表
C代码: #include<stdio.h> #include<stdlib.h> #include<malloc.h> //创建简单静态链表 typedef st ...
- Signal ()函数详细介绍 Linux函数
http://blog.csdn.net/ta893115871/article/details/7475095 Signal ()函数详细介绍 Linux函数 signal()函数理解 在<s ...
- js中使用队列发送ajax请求
最近,项目中需要按照先后顺序发送ajax请求,并且在一次请求结束后才能发起下一次,不然就会导致逻辑错误. 解决办法是定义一个数组,保存ajax请求数据. 以下使用extjs4定义一个类 Ext.def ...
- 通过P-SMR看State Machine Replication
在一个复制系统中,为了保持一致性,各个replicated server是串行运行.这样性能上就会比仅仅有一台server的系统慢,由于仅仅有一台server能够进行并行处理.假设在复制系统中各个se ...
- Cocos2d-x 3.1.1 Lua演示样例 ActionEaseTest(动作)
Cocos2d-x Lua演示样例 ActionEaseTest(动作) 本篇博客介绍Cocos2d-x中的动作,Cocos2d-x为我们提供了丰富的动作接口,以下笔者就具体介绍一下: 本系列 ...
- OAuth2.0 错误码
http://open.taobao.com/doc/detail.htm?id=118 OAuth2.0 错误码 新浪微博OAuth2.0实现中,授权服务器在接收到验证授权请求时,会按照OAuth2 ...
- HDU2054_A == B ?【模拟题】【大数】【水的问题】
A == B ? Time Limit: 1000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others) Total S ...