//获取元素属性

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函数的更多相关文章

  1. 工作中常用的JS函数整理分享(欢迎大家补充)

    今年在渣X工作整理的常用JS函数 今年来了渣X工作,我所在这个部门分工很奇怪,CSS竟然有专门的人在搞,开发PHP的人员需要处理JS,以至于有时候开发起来不是那么得心应手,感觉把JS和CSS拆开就像是 ...

  2. 常用原生JS函数和语法集合

    luoyishan-2017-10-08 1. 输出语句:document.write(""); 2. JS中的注释为// 3. 传统的HTML文档顺序是:document-> ...

  3. 常用的js函数

    function $(){ return document.getElementById(arguments[0])}; /** * 得到上一个元素 * @param {Object} elem */ ...

  4. 100多个基础常用JS函数和语法集合大全

    网站特效离不开脚本,javascript是最常用的脚本语言,我们归纳一下常用的基础函数和语法: 1.输出语句:document.write(""); 2.JS中的注释为//3.传统 ...

  5. (转)在网页中JS函数自动执行常用三种方法

    原文:http://blog.sina.com.cn/s/blog_6f6b4c3c0100nxx8.html 在网页中JS函数自动执行常用三种方法 在网页中JS函数自动执行常用三种方法 在HTML中 ...

  6. 原生JS研究:学习jquery源码,收集整理常用JS函数

    原生JS研究:学习jquery源码,收集整理常用JS函数: 1. JS获取原生class(getElementsByClass) 转自:http://blog.csdn.net/kongjiea/ar ...

  7. api日常总结:前端常用js函数和CSS常用技巧

    我的移动端media html{font-size:10px} @media screen and (min-width:321px) and (max-width:375px){html{font- ...

  8. web前端关于html转义符的常用js函数

    web前端关于html转义符的常用js函数 //去掉html标签 function removeHtmlTab(tab) { return tab.replace(/<[^<>]+? ...

  9. 基础常用JS函数和语法

    100多个基础常用JS函数和语法集合大全  来源:http://www.cnblogs.com/hnyei/p/4605103.html 网站特效离不开脚本,javascript是最常用的脚本语言,我 ...

随机推荐

  1. pcl1.7.2_vs2013_x64工程配置

    pcl1.7.2_vs2013_x64工程配置 C:\Program Files\PCL 1.7.2\include\pcl-1.7;C:\Program Files\PCL 1.7.2\3rdPar ...

  2. java poi 导出excel

    poi的jar下载地址:http://poi.apache.org/ 下载后会有很多jar,但是如果只是简单的excel报表的话,导入一个poi-版本号-日期.jar就可以了. 导出代码: priva ...

  3. Github android客户端源代码分析之一:环境搭建

    1.下载相应的包及项目,参考https://github.com/github/android/wiki/Building-From-Eclipse. 2.若需查看某些包的源文件或者javadoc,则 ...

  4. Transition 所支持的css属性

    transition-property是用来指定当元素其中一个属性改变时执行transition效果: 所支持的属性类型如下: color: 通过红.绿.蓝和透明度组件变换(每个数值处理)如:back ...

  5. [汇编语言]-第九章 在屏幕中间分别显示绿底红色,白底蓝色字符串"welcome to masm!"

    ;在屏幕中间分别显示绿色,绿底红色,白底蓝色字符串"welcome to masm!" assume cs:codesg,ds:datasg,ss:stacksg datasg s ...

  6. FFMPEG图片转视频

    1.分离视频音频流 ffmpeg -i input_file -vcodec copy -an output_file_video //分离视频流 ffmpeg -i input_file -acod ...

  7. .Net MVC4 加.html后缀报404问题

    一.配置方法: routes.MapRoute( name: "User_Default1", url: "user/{action}.html", defau ...

  8. Nginx 配置指令的执行顺序(八)

    前面我们详细讨论了 rewrite.access 和 content 这三个最为常见的 Nginx 请求处理阶段,在此过程中,也顺便介绍了运行在这三个阶段的众多 Nginx 模块及其配置指令.同时可以 ...

  9. GDAL的RASTERIO功能

             为了能快速的显示大影像,最近一直在学习GDAL,GDAL确实是一个功能强大的开源库,其核心部分数据集和波段,下面这个图很详细的描述了它们之间的关系,还有其中的细节:     GDAL ...

  10. 可获取公网IP的网址

    由于代理检验需要,现在小站经受不住大流量测试,于是多收集了一些. http://1111.ip138.com/ic.asp, http://ip.360.cn/IPShare/info, http:/ ...