JavaScript常用脚本汇总(三)


Posted in Javascript onMarch 04, 2015

通过数组,拓展字符串拼接容易导致性能的问题

function StringBuffer() {

    this.__strings__ = new Array();

}

StringBuffer.prototype.append = function (str) {

    this.__strings__.push(str);

    return this;

}

StringBuffer.prototype.toString = function () {

    return this.__strings__.join("");

}

var buffer = new StringBuffer();

buffer.append("Hello ").append("javascript");

var result = buffer.toString();

alert(result);    //Hello javascript

代码来源:https://gist.github.com/hehongwei44/fe71f10e4d2d9295aeab

页面 视口 滚动条的位置的辅助函数

/*确定当前页面高度和宽度的两个函数*/

function pageHeight() {

    return document.body.scrollHeight;

}

function pageWidth() {

    return document.body.scrollWidth;

}

/*确定滚动条水平和垂直的位置*/

function scrollX() {

    var de = document.documentElement;

    return self.pageXOffset || (de && de.scrollLeft) || document.body.scrollLeft;

}

function scrollY() {

    var de = document.documentElement;

    return self.pageYOffset || (de && de.scrollTop) || document.body.scrollTop;

}

/*确定浏览器视口的高度和宽度的两个函数*/

function windowHeight() {

    var de = document.documentElement;

    return self.innerHeight || (de && de.clientHeight) || document.body.clientHeight;

}

function windowWidth() {

    var de = document.documentElement;

    return self.innerWidth || (de && de.clientWidth) || document.body.clientWidth;

}

代码来源:https://gist.github.com/hehongwei44/62907b9b7061d4defadb

调节元素透明度的函数

/*调节元素透明度的函数*/

function setOpacity(elem, level) {

    //IE处理透明度

    if (elem.filters) {

        elem.style.filters = 'alpha(opacity=' + level + ')';

    } else {

        elem.style.opacity = level / 100;

    }

}

代码来源:https://gist.github.com/hehongwei44/87839cd3b8439aff6a3c

获取鼠标位置的几个通用的函数

/*两个通用函数,用于获取鼠标相对于整个页面的当前位置*/

function getX(e) {

    e = e || window.event;

    return e.pageX || e.clientX + document.body.scrollLeft;

}

function getY(e) {

    e = e || window.event;

    return e.pageY || e.clientY + document.body.scrollTop;

}

/*两个获取鼠标相对于当前元素位置的函数*/

function getElementX(e) {

    return (e && e.layerX) || window.event.offsetX;

}

function getElementY(e) {

    return (e && e.layerY) || window.event.offsetY;

}

代码来源:https://gist.github.com/hehongwei44/2732365bd42baa491ef8

使用cssdisplay属性来切换元素可见性的一组函数

/**

 * 使用display来隐藏元素的函数

 * */

function hide(elem) {

    var curDisplay = getStyle(elem, 'display');
    if (curDisplay != 'none') {

        elem.$oldDisplay = curDisplay;

    }

    elem.style.display = 'none';

}

/**

 * 使用display来显示元素的函数

 * */

function show(elem) {

    elem.style.display = elem.$oldDisplay || '';

}

代码来源:https://gist.github.com/hehongwei44/b4192af8227d756bfda6

样式相关的通用函数

/**

 * 获取指定元素(elem)的样式属性(name)

 * */

function getStyle(elem, name) {

    //如果存在于style[]中,那么它已被设置了(并且是当前的)

    if (elem.style[name]) {

        return elem.style[name];

    }

    //否则,测试IE的方法

    else if (elem.currentStyle) {

        return elem.currentStyle[name];

    }

    //或者W3C的方法

    else if(document.defaultView && document.defaultView.getComputedStyle){

        name = name.replace(/(A-Z)/g, "-$1");

        name = name.toLowerCase();

        var s = document.defaultView.getComputedStyle(elem, "");

        return s && s.getPropertyValue(name);

    }

    //否则,用户使用的是其他浏览器

    else {

        return null;

    }

}

代码来源:https://gist.github.com/hehongwei44/9abf63536accd0f2eeb7

获取元素当前的高度和宽度

/**

 * 获取元素的真实高度

 * 依赖的getStyle见上面的函数。

 * */

function getHeight(elem) {

    return parseInt(getStyle(elem, 'height'));

}

/**

 * 获取元素的真实宽度

 * 依赖的getStyle见上面的函数

 * */

function getWidth(elem) {

    return parseInt(getStyle(elem, 'width'));

}

代码来源:https://gist.github.com/hehongwei44/b524ff25991d99625eb2

以上就是本文分享的javascript常用脚本了,希望大家能够喜欢。

Javascript 相关文章推荐
jquery实现手风琴效果实例代码
Nov 15 Javascript
javascript页面动态显示时间变化示例代码
Dec 18 Javascript
使用jQuery操作HTML的table表格的实例解析
Mar 13 Javascript
JavaScript判断用户名和密码不能为空的实现代码
May 16 Javascript
Ionic实现页面下拉刷新(ion-refresher)功能代码
Jun 03 Javascript
JavaScript利用Date实现简单的倒计时实例
Jan 12 Javascript
javascript函数的节流[throttle]与防抖[debounce]
Nov 15 Javascript
JS实现同一DOM元素上onClick事件与onDblClick事件并存的解决方法
Jun 07 Javascript
解决百度Echarts图表坐标轴越界的方法
Oct 17 Javascript
对TypeScript库进行单元测试的方法
Jul 18 Javascript
详解BootStrap表单验证中重置BootStrap-select验证提示不清除的坑
Sep 17 Javascript
JS如何监听div的resize事件详解
Dec 03 Javascript
JavaScript常用脚本汇总(二)
Mar 04 #Javascript
JS实现可缩放、拖动、关闭和最小化的浮动窗口完整实例
Mar 04 #Javascript
JavaScript常用脚本汇总(一)
Mar 04 #Javascript
JS+CSS实现Div弹出窗口同时背景变暗的方法
Mar 04 #Javascript
js实现iGoogleDivDrag模块拖动层拖动特效的方法
Mar 04 #Javascript
JavaScript中的关联数组问题
Mar 04 #Javascript
JavaScript中常见获取元素的方法汇总
Mar 04 #Javascript
You might like
php excel reader读取excel内容存入数据库实现代码
2012/12/06 PHP
基于HBase Thrift接口的一些使用问题及相关注意事项的详解
2013/06/03 PHP
php文件夹与文件目录操作函数介绍
2013/09/09 PHP
thinkphp实现发送邮件密码找回功能实例
2014/12/01 PHP
几行代码轻松实现PHP文件打包下载zip
2017/03/01 PHP
PHP实现防盗链的方法分析
2017/07/25 PHP
csdn 批量接受好友邀请
2009/02/19 Javascript
Javascript实现的类似Google的Div拖动效果代码
2011/08/09 Javascript
使用Node.js实现一个简单的FastCGI服务器实例
2014/06/09 Javascript
jQuery.deferred对象使用详解
2016/03/18 Javascript
jQuery新窗口打开外链接
2016/07/21 Javascript
JavaScript里 ==与===区别详解
2016/08/16 Javascript
浅谈bootstrap使用中的一些问题以及解决过程
2016/10/18 Javascript
微信小程序-滚动消息通知的实例代码
2017/08/03 Javascript
Vue+axios实现统一接口管理的方法
2018/07/23 Javascript
JavaScript:ES2019 的新特性(译)
2019/08/08 Javascript
JS实现盒子拖拽效果
2020/02/06 Javascript
编写一个javascript元循环求值器的方法
2020/04/14 Javascript
python实现划词翻译
2020/04/23 Python
儿童编程python入门
2018/05/08 Python
Python使用type关键字创建类步骤详解
2019/07/23 Python
Pytorch 解决自定义子Module .cuda() tensor失败的问题
2020/06/23 Python
Python图像处理二值化方法实例汇总
2020/07/24 Python
class类在python中获取金融数据的实例方法
2020/12/10 Python
美国在线印刷公司:PsPrint
2017/10/12 全球购物
联想新加坡官方网站:Lenovo Singapore
2017/10/24 全球购物
乔丹诺(Giordano)酒庄德国官网:找到最好的意大利葡萄酒
2017/12/28 全球购物
日本最佳原创设计品牌:Felissimo(芬理希梦)
2019/03/19 全球购物
俄罗斯EPL钻石珠宝店:ЭПЛ
2019/10/22 全球购物
绩效专员岗位职责
2013/12/02 职场文书
护士毕业自我鉴定
2014/02/07 职场文书
教师现实表现材料
2014/02/14 职场文书
开展创先争优活动总结
2014/08/28 职场文书
2014年个人业务工作总结
2014/11/17 职场文书
辞职信怎么写
2015/02/27 职场文书
教学督导岗位职责
2015/04/10 职场文书