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 折半查找字符在数组中的位置(有序列表)
Dec 09 Javascript
javascript中通过arguments参数伪装方法重载
Oct 08 Javascript
Bootstrap进度条组件知识详解
May 01 Javascript
js和jQuery设置Opacity半透明 兼容IE6
May 24 Javascript
JavaScript ES6的新特性使用新方法定义Class
Jun 28 Javascript
JQuery组件基于Bootstrap的DropDownList(完整版)
Jul 05 Javascript
jQuery基于ajax方式实现用户名存在性检查功能示例
Feb 10 Javascript
JavaScript实现瀑布流图片效果
Jun 30 Javascript
Angular 4.x+Ionic3踩坑之Ionic 3.x界面传值详解
Mar 13 Javascript
ios设备中angularjs无法改变页面title的解决方法
Sep 13 Javascript
浅谈微信页面入口文件被缓存解决方案
Sep 29 Javascript
vue组件中节流函数的失效的原因和解决方法
Dec 02 Vue.js
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设计模式之简单工厂模式详解
2014/09/04 PHP
thinkphp5.1框架模板布局与模板继承用法分析
2019/07/19 PHP
javascript Select标记中options操作方法集合
2008/10/22 Javascript
JQuery优缺点分析说明
2011/04/10 Javascript
JS的千分位算法实现思路
2013/07/31 Javascript
原始的js代码和jquery对比体会
2013/09/10 Javascript
jquery ajax传递中文参数乱码问题及解决方法说明
2014/02/07 Javascript
JavaScript数组Array对象增加和删除元素方法总结
2015/01/20 Javascript
详解JavaScript基于面向对象之创建对象(1)
2015/12/10 Javascript
Angularjs全局变量被作用域监听的正确姿势
2016/02/06 Javascript
深入理解逻辑表达式的用法 与或非的用法
2016/06/06 Javascript
jQuery实现用户输入自动完成功能
2017/02/13 Javascript
vue指令以及dom操作详解
2017/03/04 Javascript
node.js操作mysql简单实例
2017/05/25 Javascript
webpack源码之loader机制详解
2018/04/06 Javascript
浅谈vue父子组件怎么传值
2018/07/21 Javascript
vue实现百度下拉列表交互操作示例
2019/03/12 Javascript
基于JavaScript判断两个对象内容是否相等
2020/01/10 Javascript
微信小程序实现发微博功能的示例代码
2020/06/24 Javascript
vue video和vue-video-player实现视频铺满教程
2020/10/30 Javascript
[10:49]2014国际邀请赛 叨叨刀塔第二期为真正的电竞喝彩
2014/07/21 DOTA
[01:37]PWL S2开团时刻DAY1&2——这符有毒
2020/11/20 DOTA
Python使用Socket(Https)Post登录百度的实现代码
2012/05/18 Python
在arcgis使用python脚本进行字段计算时是如何解决中文问题的
2015/10/18 Python
selenium + python 获取table数据的示例讲解
2018/10/13 Python
解决每次打开pycharm直接进入项目的问题
2018/10/28 Python
Python环境使用OpenCV检测人脸实现教程
2020/10/19 Python
Farfetch香港官网:汇集全球时尚奢侈品购物平台
2017/11/26 全球购物
全球在线商店:BerryLook
2019/04/14 全球购物
志愿者宣传口号
2014/06/17 职场文书
四风问题查摆材料
2014/08/25 职场文书
结婚喜宴迎宾词
2015/08/10 职场文书
2016年度继续教育学习心得体会
2016/01/19 职场文书
Spring Bean的实例化之属性注入源码剖析过程
2021/06/13 Java/Android
Python的代理类实现,控制访问和修改属性的权限你都了解吗
2022/03/21 Python
什么是Python装饰器?如何定义和使用?
2022/04/11 Python