在NodeJs中使用jQuery？

有时候在项目中需要使用jq在node中，但是使用起来却不是那么友好，那么现在该怎么做？改写JQ插件？将JQ插件打包成npm包，再在项目中进行引用？显然这些相比较于难度都比较大。接下来介绍一种简单的方法。

首先安装jquery以及jsdom。

jquery：https://www.npmjs.com/package/jquery

jsdom：https://www.npmjs.com/package/jsdom

命令如下：

npm install jquery

npm install jsdom

安装完成之后，在项目中引入

const $ = require('jquery')(require("jsdom").jsdom().defaultView);

以上代码为老版本的代码，在jsdom更新后，不可用

新版本的使用方法为：

const jsdom = require('jsdom');

const {JSDOM} = jsdom;

const {document} = (new JSDOM('<!doctype html><html><body></body></html>')).window;

global.document = document;

const window = document.defaultView;

const $ = require('jquery')(window);

将这些文件引入到jq所在的目录中，并且将原来jq声明的立即执行函数进行替换。

(function($) {

//some var

//some function

//dosometing

})(jQuery);

最终的形式类似于这样

const jsdom = require('jsdom');

const {JSDOM} = jsdom;

const {document} = (new JSDOM('<!doctype html><html><body></body></html>')).window;

global.document = document;

const window = document.defaultView;

const $ = require('jquery')(window);
//some var

//some function

//dosometing




然后可以根据node的写法，将自己的函数暴露出去。
												


											
NodeJs中使用jQuery？的更多相关文章
	

    
						
  1. 通读cheerio API ——NodeJs中的jquery
		
    通读cheerio API ——NodeJs中的jquery 所谓工欲善其事,必先利其器,所以通读了cheerio的API,顺便翻译了一遍,有些地方因为知道的比较少,不知道什么意思,保留了英文,希望各 ...
    
		
    2. 
								
  2. nodejs中使用cheerio爬取并解析html网页
		
    nodejs中使用cheerio爬取并解析html网页 转 https://www.jianshu.com/p/8e4a83e7c376 cheerio用于node环境,用法与语法都类似于jquery ...
    
		
    3. 
						
  3. Angular杂谈系列1-如何在Angular2中使用jQuery及其插件
		
    jQuery,让我们对dom的操作更加便捷.由于其易用性和可扩展性,jQuer也迅速风靡全球,各种插件也是目不暇接. 我相信很多人并不能直接远离jQuery去做前端,因为它太好用了,我们以前做的东西大 ...
    
		
    4. 
						
  4. nodejs中获取时间戳、时间差
		
    Nodejs中获取时间戳的方法有很多种,例如: new Date().getTime() Date.now() process.uptime() process.hrtime() 平时想获取一个时间戳 ...
    
		
    5. 
						
  5. 在Nodejs中如何调用C#的代码
		
    最近需要在Nodejs中用到C#的代码,从网上了解到可以采用Edgejs来实现Nodejs与C#的代码交互, 直接复制网上的代码运行总是出各种错,填了不少坑,现在把自己的案例代码大致整理一下,方便以后 ...
    
		
    6. 
						
  6. IE7中使用Jquery动态操作name问题
		
    问题:IE7中无法使用Jquery动态操作页面元素的name属性. 在项目中有出现问题,某些客户的机器偶尔会有,后台取不到前台的数据值. 然开发和测试环境总是不能重现问题.坑爹之处就在于此,不能重现就 ...
    
		
    7. 
						
  7. 关于angularjs中的jQuery
		
    关于angularjs中的jQuery 下面是一个小例子,用来说明我经常看到的一种模式.我们需要一个开关型的按钮.(注意:这个例子的代码有点装逼,并且有点冗长,只是为了用来代表更加复杂一些的例子,这些 ...
    
		
    8. 
						
  8. nodejs 中自定义事件
		
    经常看到 req.on('error', function(){...}); 这种代码. 在nodejs中,可以使用 EventEmitter来实现. 具体的关键词有如下几个: var reqEven ...
    
		
    9. 
						
  9. 在.NET中使用JQuery 选择器精确提取网页内容
		
    1. 前言 相信很多人做开发时都有过这样的需求:从网页中准确提取所需的内容.思前想后,方法无非是以下几种:(本人经验尚浅,有更好的方法还请大家指点) 1. 使用正则表达式匹配所需元素.(缺点:同类型的 ...
    
		
    10. 
		

	


随机推荐
	

    
									
  1. Django问题 TypeError: __init__() missing 1 required positional argument: 'on_delete'
			
    问题:在执行python manage.py makemigrations learning_logs时,系统会报错,提示:TypeError: __init__() missing 1 requir ...
    
			
    2. 
						
  2. 【题解】Crash的数字表格 BZOJ 2154 莫比乌斯反演
			
    题目传送门 http://www.lydsy.com/JudgeOnline/problem.php?id=2154 人生中第一道自己做出来的莫比乌斯反演 人生中第一篇用LaTeX写数学公式的博客 大 ...
    
			
    3. 
						
  3. JQuery学习三(隐式迭代和节点遍历)
			
    在JQuery中根据id获取控件,如果输入id错误是不报错的. 必要时可以通过写判断语句进行判断是否id写错 <!DOCTYPE html> <html xmlns="ht ...
    
			
    4. 
						
  4. ACM1258邻接表
			
    教训:使用邻接表的时候一定要把邻接表的结构组定义的足够大,不能仅仅等于节点的个数,因为线段的数量往往远超过节点的数量. 这个题目是拓扑排序练习,提高下理解. #include<iostream& ...
    
			
    5. 
						
  5. HDU3524 数论
			
    Perfect Squares Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)T ...
    
			
    6. 
						
  6. 实体框架(Entity Framework)快速入门--实例篇
			
    在上一篇 <实体框架(Entity Framework)快速入门> 中我们简单了解的EF的定义和大体的情况,我们通过一步一步的做一个简单的实际例子来让大家对EF使用有个简单印象,看操作步骤 ...
    
			
    7. 
						
  7. ubuntu18.04server设置静态IP
			
    16.04以后的版本配置静态IP是类似这样的文件 /etc/netplan/50-cloud-init.yaml 1.查询网卡名称 2.修改配置文件/etc/netplan/50-cloud-init ...
    
			
    8. 
						
  8. [LeetCode] 9. Palindrome Number ☆
			
    Determine whether an integer is a palindrome. Do this without extra space. Some hints: Could negativ ...
    
			
    9. 
						
  9. Ubuntu12.04 安装nginx和mongo过程
			
    1.安装php和php-cgi apt-get install php5 php5-cgi 2.安装 nginx apt-get install nginx 3.安装 MongoDB apt-get  ...
    
			
    10. 
						
  10. Freemarker的配置与使用
			
    1.在pro.xml配置文件中引入架包 <!--freemarker-->  <dependency>   <groupId>freemarker</grou ...
    
			
    11.