【写一个自己的js库】 5.添加修改样式的方法

1.根据id或class或tag修改样式,样式名是-连接格式的. function setStyleById(elem, styles){ if(!(elem = $(elem)) return false; for(prop in styles){ if(!styles.hasOwnProperty(prop)) continue; if(elem.style.setProperty){ elem.style.setProperty(prop, styles[prop]); }else{ el…

总结：js中4类修改样式的方法

前言最近在写一个扩展右键菜单的插件,既然是插件,想着一步到位,把相关的style样式设置都丢进js文件中,直接加载一个js文件便可以使用该插件,所以今天就研究了下js批量的插入样式的方法,即addSheet(),顺便总结下Javascript中修改样式的4类方法正文 1.通过js动态的创建style对象直接贴代码更为方便,这是addCssRule方法,可以一条一条规则的添加到样式表中 var addCssRule = (function () { //该方法因为引用了闭包,无论如何都会创建…

【写一个自己的js库】 3.添加几个处理字符串的方法

1.生成重复的字符串 if(!String.repeat){ String.prototype.repeat = function (count){ return new Array(count + 1).join(this); } } 2.去除开头和结尾的空字符 if(!String.trim){ String.prototype.trim = function (){ return this.replace(/^\s+|\s+$/g, ''); } } 3.将"-"格式的字符串变成…

【写一个自己的js库】 2.实现自己的调试日志

还是本着学习的目的,实现一个自己的调试日志,界面很简单,就是将调试信息显示在页面的正中央,用一个ul包裹,每条信息就是一个li. 1.新建一个myLogger.js文件,将需要的方法声明一下.其中var声明的是私有成员,可见范围只在构造函数中,每个实例都会保存一套他们的副本.this声明的是特权方法,new的时候会把它绑定到实例上,实例可以直接调用它.在prototype上声明的就是公有方法了,每个实例都可以访问它.最后将一个实例赋值给Lily这个库,Lily就有自己的日志插件了. functi…

【写一个自己的js库】 1.搭个架子先

最近在看<javascript dom 高级程序设计>,想着跟着里面的代码敲一遍吧,也算是做一下学习笔记吧,所以这不是重新发明轮子,只是个学习的过程. 1.先确定自己的命名空间,并且加入几个常用的js方法.命名空间很重要啊,保证了自己库里的变量不污染全局空间,不和其他的库的变量名起冲突.命名空间的惯例就是把代码都放在自执行函数(function(){})()里了,然后暴露个方法给window对象了.所以0.1版本的代码就长下面这样了.(这里暂时没有用继承) (function(){ //命名空…

【写一个自己的js库】 4.完善跨浏览器事件操作

1.阻止冒泡. function stopPropagation(event){ event = event || getEvent(event); if(event.stopPropagation){ event.stopPropagation(); }else{ event.cancelBubble = true; } } Lily['event'] = stopPropagation; 2.阻止事件默认动作. function preventDefault(event){ event =…

仿照jquery封装一个自己的js库（一）

所谓造轮子的好处就是复习知识点,加深对原版jquery的理解. 本文系笔者学习jquery的笔记,记述一个名为"dQuery"的初级版和缩水版jquery库的实现.主要涉及知识点包括面向对象,jquery,绑定,脚本化css等. 一. jquery的美元符意味什么? 先思考alert(typeof $)的结果中的$,它是一个对象,也是一个函数. 所以美元符字面上是jQuery,其实就是一个jq对象,里面可以接受函数,字符串(#xxx,.xxx,xxx...),还有一种是对象(比如thi…

仿照jquery封装一个自己的js库

所谓造轮子的好处就是复习知识点,加深对原版jquery的理解.本文系笔者学习jquery的笔记,记述一个名为"dQuery"的初级版和缩水版jquery库的实现.主要涉及知识点包括面向对象,jquery,绑定,脚本化css等. 一. jquery的美元符意味什么? 先思考alert(typeof $)的结果中的$,它是一个对象,也是一个函数.所以美元符字面上是jQuery,其实就是一个jq对象,里面可以接受函数,字符串(#xxx,.xxx,xxx...),还有一种是对象(比如this)…

Java基础-接口．编写2个接口：InterfaceA和InterfaceB；在接口InterfaceA中有个方法void printCapitalLetter()；在接口InterfaceB中有个方法void printLowercaseLetter()；然后写一个类Print实现接口InterfaceA和InterfaceB，要求方法实现输出大写英文字母表的功能，printLowerca

#34．编写2个接口:InterfaceA和InterfaceB:在接口InterfaceA中有个方法void printCapitalLetter():在接口InterfaceB中有个方法void printLowercaseLetter():然后写一个类Print实现接口InterfaceA和InterfaceB,要求方法实现输出大写英文字母表的功能,printLowercaseLetter()方法实现输出小写英文字母表的功能.再写一个主类E,在主类E的main方法中创建P…

MySql表、字段、库的字符集修改及查看方法

这篇文章主要介绍了MySql表.字段.库的字符集修改及查看方法,本文分别给们它的修改及查看语句,需要的朋友可以参考下修改数据库字符集: 代码如下: ALTER DATABASE db_name DEFAULT CHARACTER SET character_name [COLLATE ...]; 把表默认的字符集和所有字符列(CHAR,VARCHAR,TEXT)改为新的字符集: 代码如下: ALTER TABLE tbl_name CONVERT TO CHARACTER SET char…

仿照jquery封装一个自己的js库（二）

本篇为完结篇.主要讲述如何造出轮子的高级特性. 一. css方法的高级操作先看本文第一部分所讲的dQuery css方法 //css方法 dQuery.prototype.css=function(attr,value){ if(arguments.length==2){//当参数个数为2时,使用设置css的方法 var i=0; for(i=0;i<this.elements.length;i++){ this.elements[i].style[attr]=value; } }else{/…

自己动手写一个iOS 网络请求库的三部曲[转]

代码示例:https://github.com/johnlui/Swift-On-iOS/blob/master/BuildYourHTTPRequestLibrary 开源项目:Pitaya,适合大文件上传的 HTTP 请求库:https://github.com/johnlui/Pitaya 本系列文章中,我们将尝试使用 NSURLSession 技术构建一个自己的网络请求库. NSURLSession 简介 NSURLSession 是 iOS7 引入的新网络请求接口,在 WWDC2013…

如何写一个自定义的js文件

自定义一个Utils.js文件,在其中写js代码即可.如: (function(w){ function Utils(){} Utils.prototype.getChilds = function(_selector){}; Utils.prototype.getNextSibling = function(_selector){}; Utils.prototype.getPrevSibling = function(_selector){}; Utils.prototype.validate…

如何写一个自己的组件库，打成NPM包，并上传到NPM远程

1.首先使用vue create my_project 构建一个自己的Vue项目 2.vue.config.js和package.json配置如下,做了些修改 const path = require('path') module.exports = { publicPath: '/', outputDir: 'dist', devServer: { port: 9981, open: true, overlay: { warnings: fals…

[WPF][Rubyer] 写一个自己的 UI 库 (二) - Icon

前言制作 WPF 的图标包,主要介绍从 iconfont 下载的图标包导入到 WPF 使用: 1. 添加文件 Ruyber 下添加自定义控件(WPF) Icon.cs.类 IconType.cs.类 IconDatas.cs Rubyer.Themes 下添加资源字典(WPF) Icon.xaml 2.下载图标 iconfont 查找自己喜欢的图标包,浏览器 F12 => Console => 输入下列代码回车,添加所有图标到购物车 var span = document.querySe…

isMobile 一个简单的JS库，用来检测移动设备

点这里 github地址:https://github.com/kaimallea/isMobile Example Usage I include the minified version of the script, inline, and at the top of the <head>. Cellular connections tend to suck, so it would be wasteful overhead to open another connection, just…

【跟着子迟品 underscore】如何优雅地写一个『在数组中寻找指定元素』的方法

Why underscore (觉得这部分眼熟的可以直接跳到下一段了...) 最近开始看 underscore.js 源码,并将 underscore.js 源码解读放在了我的 2016 计划中. 阅读一些著名框架类库的源码,就好像和一个个大师对话,你会学到很多.为什么是 underscore?最主要的原因是 underscore 简短精悍(约 1.5k 行),封装了 100 多个有用的方法,耦合度低,非常适合逐个方法阅读,适合楼主这样的 JavaScript 初学者.从中,你不仅可以学到用…

js给图层添加动态样式

需求:需要在视窗内随意点击对应位置,图层从上到下匀速运动到指定位置 html <img id="moveDot" class="moveDot" src="images/moveDot.png"> js //地图插点动态效果 //横坐标 var x=120; //纵坐标 var y=200; var style = document.styleSheets[0]; style.insertRule('.moveDot {width:3…

js 左侧树添加选择样式

选择样式添加 menuToggle: function() { var menus = $('.nav-primary').children('li'); var tog = menus.has('.nav-secondary').children('a'); tog.on('click', function(event) { event.preventDefault(); var $this = $(this); menus.not($this.parent('li')).removeClas…

通过写一个Demo展示C#中多种常用的集合排序方法

不多说,程序很简单,就是将集合中的数据进行排序,但使用到的知识点还是比较多的,大牛勿喷,谨献给初学者!直接上程序吧! namespace Demo { /// <summary> /// Demo:使用不同排序方法对元素进行排序 /// </summary> class Program { private static void Main(string[] args) { ArrayList arrayList = Product.GetArrayList(); List<P…

CentOS 7下iptables配置添加修改规则端口方法（转）

简介: Linux CentOS 7默认没有安装iptables,默认的防火墙是firewalld,云吞铺子分享CentOS 7系统下iptables安装.iptables规则配置(放行或者禁用端口)教程方法: 以下大致步骤为:先关闭firewalld防火墙,然后按照iptables,最后配置添加或者禁用端口规则,详细如下: 检查firewalld并禁用安装iptables之前先检查下当前CentOS 7系统下的firewalld防火墙状态,如果是开启状态,需要先关闭firewalld防火墙.…

在a标签内添加hover样式的方法：

<a href="javascript:void(0);" onmouseover="this.style.color='yellow';" onmouseout="this.style.color='blue';" onclick="this.style.color= 'red';">链接</a> onmouseout代表a:link onclick代表a:visited onmouseover代表a…

近期写js库中遇到的一个判别的问题

最近在写一个自己的js库,正写到数组包,在里面定义了一个排序,只对纯数字数据进行排序的方法,但是在测试的时候发现一个很诡异的问题,那就是传入一个对象的时候,它没有返回erroemsg而是返回了对象,上代码: array.sort=function(a){//only for num try{ if(!a.some(function(x){return(typeof("string"))})){ var max=a.length-1; for(var j=0;j<max;j++){…

【转载】写一个js库需要怎样的知识储备和技术程度？

作者:小爝链接:https://www.zhihu.com/question/30274750/answer/118846177来源:知乎著作权归作者所有,转载请联系作者获得授权. 1,如何编写健壮的javascript代码,鲁棒性,简单总结几条我觉得是常识的事:1.1 一个javascript库最好的实现方式是占用最少的命名空间,比如window对象上或者global对象上只占用一个引用.1.2 健壮的js程序对输入都会有完善的类型检查和异常处理,边界值的判断.1.3 对js的几种继承方式要足…

从 0 到 1 到完美，写一个 js 库、node 库、前端组件库

之前讲了很多关于项目工程化.前端架构.前端构建等方面的技术,这次说说怎么写一个完美的第三方库. 1. 选择合适的规范来写代码 js 模块化的发展大致有这样一个过程 iife => commonjs/amd => es6,而在这几个规范中: iife: js 原生支持,但一般不会直接使用这种规范写代码 amd: requirejs 定义的加载规范,但随着构建工具的出现,便一般不会用这种规范写代码 commonjs: node 的模块加载规范,一般会用这种规范写 node 程序 es6: ECMA…

前端与编译原理——用JS写一个JS解释器

说起编译原理,印象往往只停留在本科时那些枯燥的课程和晦涩的概念.作为前端开发者,编译原理似乎离我们很远,对它的理解很可能仅仅局限于"抽象语法树(AST)".但这仅仅是个开头而已.编译原理的使用,甚至能让我们利用JS直接写一个能运行JS代码的解释器. 项目地址:https://github.com/jrainlau/c... 在线体验:https://codepen.io/jrainlau/p... 一.为什么要用JS写JS的解释器接触过小程序开发的同学应该知道,小程序运行的环境禁止n…

用javascript写一个emoji表情插件

概述以我们写的这个emoji插件为例,网上已经有一些相关的插件了,但你总感觉有些部分的需求不能被满足(如:可以自行添加新的表情包而不用去改源代码等等) 详细代码下载:http://www.demodashi.com/demo/10345.html 很久没有写文章了,说实话本人现在受困于五月病已经快变成一条死咸鱼了(T_T),本次就当写一个简单的js插件教程了.本项目的代码相对比较简单,至于里面有些变量命名的问题就请你们不要吐槽了Σ(ﾟдﾟlll)(好的,我承认我英语就小学水平好吧.除了hel…

轻量级的绘制图表js库--Morris.js

Morris.js 是一个轻量级的 JS 库,使用 jQuery 和 Raphaël 来生成各种时序图. 虽说现在移动手机网络已经到了4G,但是在移动web客户端开发过中,为了达到良好的体验效果,需要考虑很多的因素,比如板式,网速等等,最近有个任务需要在移动端显示<span>标签的内容,所有找js类的开源库,最终选择Morris.js ,一个是小,另外是支持移动包括iso和android,项目地址:点击打开链接,相比其他的开源库,这个上手还是比较简单的,可以看看官方的例子,但是有一些需要注意的…

怎样写一个webpack loader

div{display:table-cell;vertical-align:middle}#crayon-theme-info .content *{float:left}#crayon-theme-info .field{font-weight:bold}#crayon-theme-info .field,#crayon-theme-info .value{margin-left:5px}#crayon-theme-info .description.value{font-style:ital…

当新手使用JS库遇到问题怎么办

见标题,知其意.在做网站时候,其实我们会用很多JS库,网络上流行的和公司自己封装的,这些东西都很好用,但是或多或少的有些bug或者有一些缺陷,即使真的很完善,但也可能达不到自己特定的一些需求.所以遇到问题,是很正常的.但是为什么要说是新手遇到问题呢?这就是因为,有些问题,工作几年的攻城狮,轻而易举的就解决了,所以对于他们这些根本不是问题,或者对于他们这些就是私人定制而已. 其实我也是这样走过来的,如果叫我自己完全封装一个非常强悍的JS库,我肯定是没有办法做的,不是因为技术,而是经验不够,因为考虑…

【【写一个自己的js库】 5.添加修改样式的方法】的更多相关文章