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 相关文章推荐
javascript引导程序
Oct 26 Javascript
javascript 匿名函数的理解(透彻版)
Jan 28 Javascript
CSS和JS标签style属性对照表(方便js开发的朋友)
Nov 11 Javascript
caller和callee的区别介绍及演示结果
Mar 10 Javascript
深入分析JQuery和JavaScript的异同
Oct 23 Javascript
浅谈js中同名函数和同名变量的执行问题
Feb 12 Javascript
BootStrap的select2既可以查询又可以输入的实现代码
Feb 17 Javascript
JavaScript结合HTML DOM实现联动菜单
Apr 05 Javascript
深入浅析Vue中的 computed 和 watch
Jun 06 Javascript
ckeditor一键排版功能实现方法分析
Feb 06 Javascript
node事件循环和process模块实例分析
Feb 14 Javascript
jquery实现异步文件上传ajaxfileupload.js
Oct 23 jQuery
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
解决ajax+php中文乱码的方法详解
2013/06/09 PHP
php的慢速日志引起的Mysql错误问题分析
2014/05/13 PHP
php实现统计网站在线人数的方法
2015/05/12 PHP
php获取数据库中数据的实现方法
2017/06/01 PHP
JQuery 确定css方框模型(盒模型Box Model)
2010/01/22 Javascript
关于html+ashx开发中几个问题的解决方法
2011/07/18 Javascript
基于jQuery实现模拟页面加载进度条
2013/04/01 Javascript
JS实现CheckBox复选框全选全不选功能
2015/05/06 Javascript
jquery实现鼠标悬浮停止轮播特效
2020/08/20 Javascript
BootStrap中关于Select下拉框选择触发事件及扩展
2016/11/22 Javascript
BootStrap select2 动态改变值的方法
2017/02/10 Javascript
提高JavaScript执行效率的23个实用技巧
2017/03/01 Javascript
JavaScript正则表达式简单实用实例
2017/06/23 Javascript
seajs中最常用的7个功能、配置示例
2017/10/10 Javascript
layer弹出层 iframe层去掉滚动条的实例代码
2018/08/17 Javascript
JavaScript使用类似break机制中断forEach循环的方法
2018/11/13 Javascript
Vue-CLI项目中路由传参的方式详解
2019/09/01 Javascript
Vue打包后访问静态资源路径问题
2019/11/08 Javascript
javascript实现多边形碰撞检测
2020/10/24 Javascript
django实现分页的方法
2015/05/26 Python
Python利用正则表达式匹配并截取指定子串及去重的方法
2015/07/30 Python
Python语言描述最大连续子序列和
2017/12/05 Python
Pythony运维入门之Socket网络编程详解
2019/04/15 Python
Python 解析库json及jsonpath pickle的实现
2020/08/17 Python
Python如何telnet到网络设备
2021/02/18 Python
Django中的DateTimeField和DateField实现
2021/02/24 Python
你应该知道的30个css选择器
2014/03/19 HTML / CSS
中国海淘族值得信赖的海淘返利网站:55海淘
2017/01/16 全球购物
大专毕业自我鉴定
2014/02/04 职场文书
安全标准化实施方案
2014/02/20 职场文书
交通志愿者活动总结
2014/06/27 职场文书
小学美术兴趣小组活动总结
2014/07/07 职场文书
相亲活动方案
2014/08/26 职场文书
南京导游词
2015/02/03 职场文书
python tkinter实现定时关机
2021/04/21 Python
Python实现对齐打印 format函数的用法
2022/04/28 Python