一背景 同一个项目中不同业务线模块的主题色不同,在切换业务模块的时候就需要改变主题色。 二实现 2.1定义变量 在业务线模块加载的入口处定义css变量。 html <style .body-box{ --themeColor:660066; --themeHeadColor:1a1818; } </style <template <divclass="body-box"ref="mytheme" <router-view/ </div </template <script exportdefault{ data(){ return{ //业务线主题配置 theme:this.$co...

  qbian   2020年01月09日   198   2   0 html5javascriptcsscss3vue.js

一背景 好多情况下我们会将高质量的网页分享给微信好友或分享到朋友圈供更多的朋友看到。这里就需要用到微信提供的jssdk的分享接口了。今天刚好做了这功能,期间也遇到了一些坑,在这里纪录一下。 在开始之前你的准备工作有哪些 微信公众号平台 有域名的服务器 二在公众号平台绑定域名 登录微信公众号,在左侧的菜单栏:公众号设置功能设置js接口安全域名(如下图所示)。在这里绑定你的域名,需要注意的是,微信分享的网页仅支持80(http)端口和443(https)端口,所以你分享的访问页面需要部署在这...

  qbian   2019年11月12日   94   1   0 html5java-eejavascript微信微信开放平台

一HTML文档的解析 1、当用户输入网页url的时候,webkit调用其资源加载器加载该url对应的网页。 2、加载器依赖网络模块建立连接,发起请求并接收答复。 3、webkit接收到各种网页或者资源的数据,其中某些资源可以是同步或者异步获取的。 4、网页被交给html解析器转变成一系列的词语(token)。 5、解析器根据词语构建节点(node),形成dom树。 6、如果节点是javascript代码的话,调用javascript引擎解释并执行。 7、javascript代码可能会...

  qbian   2019年11月12日   87   1   0 html5htmljavascriptcsscss3

一发布订阅模式的由来 发布订阅模式是在观察者模式的基础上又抽象了一层,上一篇文章JS:观察者模式中我们也有说过,触发事件的对象和观察事件的对象必须是同一个对象,这也是观察者模式的不足所在,正是在此缺点的基础上,发布订阅模式由此产生。 发布订阅模式不要求发布消息的生产者和订阅消息的消费者是同一个对象,更不会限制发布者的个数以及生产者的个数。也就是说我们可以创建多个发布者对象共同发布消息,发布到多个主题下,也可以创建多个消费者对象共同消费消息,同一个消费者也可以订阅多个主题。这样我们就可以将生产者和消费者完全解偶,彼此感知不到对方的存在。生产者和生产者之间也完全解偶,同时消费者之间也是如此。 ...

  qbian   2019年11月12日   102   1   0 javascript

一背景 js在es6之前是没有模块化的,所以后来有了nodejs的commonjs规范以及amd规范等的出现。 根据YUI规约,我们不应该定义更多的对象在window上。所以就需要将不同功能模块的js定义在同一个对象上。这就促使了模块模式的出现。 二代码示例 2.1定义 js window.qbian=window.qbian||{}; window.qbian.module1=(function($){ varprivateVar=1, publicVar=2; functionprivateFunc(){ console.info('privateFunc1privateV...

  qbian   2019年11月12日   70   1   0 javascript

一js中观察者模式的使用 js是一门事件驱动的语言,所以在其语言内部存在大量的观察者模式的使用案例。 例如各种dom事件的监听函数等。其与观察者模式配合使用也是最完美的。 二代码示例 2.1定义Event类 下面我们定义一个供继承使用的Events功能模块,如下所示: js window.Event=(function(){ functionEvent(){ this._events={}; } Event.prototype={ emit:function(name,obj){ if(nameinthis._events){ for(vari=0,len=this._events[...

  qbian   2019年11月12日   87   1   0 javascriptangular.jsvue.jsreact.js

一Object.assign() 将多个对象的可枚举属性拷贝到目标对象上,并且返回赋值后的目标对象。 Object.assign(target,...sources) target:目标对象 ...sources:源对象 测试如下: js varsource1={ name1:'source1', age1:18 }; varsource2={ name2:'source2', age2:19 }; vartarget=Object.assign({name:'target'},source1,source2); console.info(JSON.stringify(targ...

  qbian   2019年11月12日   70   1   0 javascriptvue.js

一CommonJS CommonJS原来叫ServerJS,是以在浏览器环境之外构建JavaScript生态系统为目标而产生的项目,比如在服务器 和桌面环境中。 CommonJS规范是为了解决JavaScript的作用域问题而定义的模块形式,可以使每个模块它自身的命名空间中执行。 该规范的主要内容是,模块必须通过module.exports导出对外的变量或接口,通过require()来导入其他模块的输出到当前模块作用域中。例子如下: js //moduleA.js module.exports=function(x){ returnxx; }; js //moduleB.js const...

  qbian   2019年11月12日   63   1   0 javascriptnode.js

一服务的创建方式: 1.通过factory构造函数创建服务 2.通过service构造函数创建服务 3.通过provider构造函数创建服务 4.通过constant构造函数创建服务 5.通过value构造函数创建服务 下面讲解一下各种方法创建服务的不同之处: 1.1通过factory创建服务 js mainApp.factory("serviceName",function(otherServiceNames){//otherServiceNames是该服务依赖的其它已创建的服务 varobj={//通过创建新对象,给对象添加方法,属性,然后返回该对象的方式创建服务 att...

  qbian   2019年11月12日   65   1   0 javascriptangular.js

使用exec方法多次匹配一段文本中指定格式的内容。 例如将文本内的<imgclass="emojismile"title="微笑"/替换为[微笑] js letreg=newRegExp(/<img[^]title="([^"])"[^]//,'g'); varresult; while((result=reg.exec(text))!=null){ text=text.replace(result[0],'['+result[1]+']'); reg.lastIndex=0; } returntext; } 需要注意的是如果在一个字符串中完成了一次模式匹配之后要开始检索新的字符串,...

  qbian   2019年11月12日   60   1   0 javascript正则表达式

一通过函数创建对象 在JavaScript中,创建对象有很多种方式,对象字面量方式,newObject()方式等,我们今天要讲的是另一种类似于Java创建对象的方式,通过函数创建对象 js functionPerson(name){ this.name=name; this.sayName=function(){ console.log(this.name); } } varp1=newPerson('p1'); p1.sayName();//p1 varp2=newPerson('p2')...

  qbian   2019年11月12日   72   1   0 javascript

一函数简介 在JavaScript中每一个函数的内部,除了声明时定义的形式参数外,每个函数还附加了两个参数:this和arguments。 参数arguments是一个数组类型的变量,数组中的值就是实际调用函数时传进来的参数列表。在定义函数时会有函数的形式参数parameters,在具体调用函数时,当实际参数arguments的个数与形式参数parameters的个数不匹配时,不会导致运行时错误。如果实际参数过多,超出的参数值会被忽略掉。如果实际参数值过少,缺少的值会被替换为undefined。函数执行时不会对参数值进行类型校验,也就是说任何类型的值都可以传递给任何参数。 参数this在...

  qbian   2019年11月12日   71   1   0 javascript

一路由配置 在路由配置信息里: js myApp.config(['$routeProvider', function($routeProvider){ //路由配置 $routeProvider .when('/login',{ controller:'login', templateUrl:'./model/login.html' }) .otherwise({ redirectTo:'/login' }); }]); 二控制器 以上是一个登录页面的配置,在配置里有controller和templateUrl的相关信息,让我们来看看templateUrl请求的login.html...

  qbian   2019年11月12日   59   1   0 javascriptangular.js

一加载远端页面 在main.js内通过BrowserWindow对象加载远端页面,如下所示: js 'usestrict'; constelectron=require('electron') constglobalShortcut=electron.globalShortcut; //Moduletocontrolapplicationlife. constapp=electron.app //Moduletocreatenativebrowserwindow. constBrowserWindow=electron.BrowserWindow //Keepaglobalrefere...

  qbian   2019年11月12日   154   1   0 html5htmljavascriptnode.jscss

一异步的应用 对于前端开发人员来说,异步编程再普遍不过了(ajax)。 对于服务端(java)开发人员来说,也存在异步编程,相关编写可参见Java分类下的“java编写异步处理方法提升系统性能”该篇文章,这里也就不放传送门了。 对于移动端所有的触发事件也都是异步的,相关开发人员应该也都是很熟悉的。 二异步和同步的比较 在java中如果需要发起网络请求,假设我们已经封装好了一个方法,如下: js Log.log("发起网络请求"); JSONObjectresult1=HttpUtil...

  qbian   2019年11月12日   95   1   0 javascriptnode.js

一CommonJs规范 讲到nodejs的模块化就不得不讲CommonJs规范了,在以前的文章里也有讲过CommonJs相关使用,具体使用可以到JavaScript类别下查看,这里就不放传送门了。在这里就不多做赘述了,下面就说一下基本的用法。 导出模块module.exports: js //DateUtil.js classDateUtil{ staticgetDate(){ returnnewDate(); } } module.exports=DateUtil; 引入模块req...

  qbian   2019年11月12日   78   1   0 javascriptnode.js

一背景 照着node的express框架我自己也封装了一个很简单的拥有基础功能的qbian-express框架。 二项目目录结构: js app.js qbian/ qbian/index.js qbian/MIME.js static/ static/index.html static/login.html static/css/ static/css/index.css static/images/ static/images/article.svg static/images/favi...

  qbian   2019年11月12日   98   1   0 javascriptnode.js

一NodeJs执行环境 我们都知道在chrome浏览器内JavaScript是在v8上解释执行的,NodeJs就是基于JavaScript环境和语言编写的,它的执行环境也就离不开v8了。放张图来说明一下浏览器和NodeJs执行环境的对比。 ![Chrome浏览器和Node的组件构成.png](https://static.developers.pub/5991e724041a4c4282a0df586940c073) 上图可用看到,在浏览器中因为需要渲染UI界面(HTML,CSS),所以...

  qbian   2019年11月12日   81   2   0 javascriptnode.js

官网链接:https://react.docschina.org/ 一路由配置 1.1入口js导入路由配置文件 js //main.js即项目入口文件 importReactfrom'react'; importRctDOMfrom'react-dom'; importRouterMapfrom'./routes'; RctDOM.render(<RouterMap/,document.getElementById('app')); 1.2具体路由配置 js //路由配置 importReactfrom'react'; import{HashRouter,Route}from'r...

  qbian   2019年11月12日   66   1   0 javascriptreact.js

一环境安装 我们需要用到webpack打包工具将我们前端代码进入依赖构建,压缩打包等以减少我们发布的静态资源文件个数,减少网络请求,提高前端的用户体验。 所以需要安装node环境,借用node自带的npm包管理工具安装webpack打包工具。 node相当于JAVA的运行环境jdk,npm相当于JAVA的仓库管理工具maven,只是node自带了npm,maven还需要再次安装。 二初始化项目 js cd/aaa/bbb/ccc mkdirfirst-react cdfirst-react //初始化一个node项目,一路回车健 npminit 三初始化文件 编辑packa...

  qbian   2019年11月12日   96   1   0 javascriptreact.js