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中关于indexOf的使用方法与问题小结
Aug 05 Javascript
使用javascript实现页面定时跳转总结篇
Sep 21 Javascript
js获取select标签选中值的两种方式
Jan 09 Javascript
jQuery中的read和JavaScript中的onload函数的区别
Aug 27 Javascript
js在指定位置增加节点函数insertBefore()用法实例
Jan 12 Javascript
基于jQuery实现收缩展开功能
Mar 18 Javascript
jQuery中实现prop()函数控制多选框(全选,反选)
Aug 19 Javascript
jQuery实现获取元素索引值index的方法
Sep 18 Javascript
jQuery实现文章图片弹出放大效果
Apr 06 jQuery
.net MVC+Bootstrap下使用localResizeIMG上传图片
Apr 21 Javascript
提升node.js中使用redis的性能遇到的问题及解决方法
Oct 30 Javascript
vue+elementUI实现表单和图片上传及验证功能示例
May 14 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图片处理:加水印、缩略图的实现(自定义函数:watermark、thumbnail)
2010/12/02 PHP
PHP实现实时生成并下载超大数据量的EXCEL文件详解
2017/10/23 PHP
PHP生成随机数的方法总结
2018/03/01 PHP
基于jQuery的弹出警告对话框美化插件(警告,确认和提示)
2010/06/10 Javascript
jQuery实现点击标题输入详细信息
2013/04/16 Javascript
js 图片随机不定向浮动的实现代码
2013/07/02 Javascript
node.js中的fs.existsSync方法使用说明
2014/12/17 Javascript
基于jQuery实现音乐播放试听列表
2016/04/14 Javascript
jQuery绑定事件的四种方式介绍
2016/10/31 Javascript
Vue keep-alive实践总结(推荐)
2017/08/31 Javascript
微信小程序如何获取用户信息
2018/01/26 Javascript
VUE 使用中踩过的坑
2018/02/08 Javascript
js中document.write和document.writeln的区别
2018/03/11 Javascript
VUE脚手架的下载和配置步骤详解
2019/04/01 Javascript
Vue+Django项目部署详解
2019/05/30 Javascript
vue拖拽组件 vuedraggable API options实现盒子之间相互拖拽排序
2019/07/08 Javascript
vue使用代理解决请求跨域问题详解
2019/07/24 Javascript
关于AngularJS中几种Providers的区别总结
2020/05/17 Javascript
python登录QQ邮箱发信的实现代码
2013/02/10 Python
Python中实现两个字典(dict)合并的方法
2014/09/23 Python
在Python下尝试多线程编程
2015/04/28 Python
深入讲解Python编程中的字符串
2015/10/14 Python
详解Python编程中基本的数学计算使用
2016/02/04 Python
python实现批量按比例缩放图片效果
2018/03/30 Python
如何通过50行Python代码获取公众号全部文章
2019/07/12 Python
千禧酒店及度假村官方网站:Millennium Hotels and Resorts
2019/05/10 全球购物
Fanatics官网:运动服装、球衣、运动装备
2020/10/12 全球购物
如何用PHP实现邮件发送
2012/12/26 面试题
董事长职责范文
2013/11/08 职场文书
外语专业毕业生个人的自荐信
2013/11/19 职场文书
中学家长会邀请函
2014/01/17 职场文书
教师师德反思材料
2014/02/15 职场文书
工会主席事迹材料
2014/06/03 职场文书
爱国口号
2014/06/19 职场文书
文明单位汇报材料
2014/12/24 职场文书
女性励志书籍推荐
2019/08/19 职场文书