教你如何在Node.js中使用jQuery


Posted in Javascript onAugust 28, 2016

想要在NodeJs中使用jQuery?

首先,我们得安装jquery, npm install jquery 。安装后的版本是 3.1.0

接着,第一感觉我们会使用 var $ = require('jquery') 。

将以下代码保存为app.js

var $ = require('jquery')

$("body").append("<div>TEST</div>");
console.log($("body").html());

运行 node app.js 。提示错误:

Error: jQuery requires a window with a document

那么我们该怎么做呢?

在 npm的jquery安装包首页 ,我们看到可以使用 jsdom 进行模拟一个document。

require("jsdom").env("", function(err, window) {
  if (err) {
    console.error(err);
    return;
  }
  var $ = require("jquery")(window);
  $("body").append("<div>TEST</div>");
  console.log($("body").html());
});

运行,结果OK。

上面的代码,有一个让我不太舒服的地方就是要在回调函数中进行操作。那么我们如何做才可以不在回调函数中进行引入jquery呢?

var $ = require('jquery')(require("jsdom").jsdom().defaultView);
$("body").append("<div>TEST</div>");
console.log($("body").html());

一样运行OK。

以上就是本文给大家分享的全部内容了,希望对大家学习node.js能够有所帮助

Javascript 相关文章推荐
JavaScript国旗变换效果代码
Aug 13 Javascript
基于jsTree的无限级树JSON数据的转换代码
Jul 27 Javascript
兼容ie、firefox的图片自动缩放的css跟js代码分享
Jan 21 Javascript
如何防止回车(enter)键提交表单
May 11 Javascript
jquery单选框radio绑定click事件实现方法
Jan 14 Javascript
JavaScript计时器示例分析
Feb 05 Javascript
jQuery绑定自定义事件的魔法升级版
Jun 30 Javascript
浅谈js的html元素的父节点,子节点
Aug 06 Javascript
全面解析vue中的数据双向绑定
May 10 Javascript
vue动态绑定组件子父组件多表单验证功能的实现代码
May 14 Javascript
Vue项目中Api的组织和返回数据处理的操作
Nov 04 Javascript
JavaScript实现简单拖拽效果
Sep 15 Javascript
分享JavaScript监听全部Ajax请求事件的方法
Aug 28 #Javascript
Node.js 日志处理模块log4js
Aug 28 #Javascript
node.js中 stream使用教程
Aug 28 #Javascript
ionic组件ion-tabs选项卡切换效果实例
Aug 27 #Javascript
郁闷!ionic中获取ng-model绑定的值为undefined如何解决
Aug 27 #Javascript
ionic实现带字的toggle滑动组件
Aug 27 #Javascript
ionic实现可滑动的tab选项卡切换效果
Apr 15 #Javascript
You might like
实现dedecms全站URL静态化改造的代码
2007/03/29 PHP
php简单日历函数
2015/10/28 PHP
thinkPHP3.2.2框架行为扩展及demo示例
2018/06/19 PHP
Yii框架学习笔记之session与cookie简单操作示例
2019/04/30 PHP
javascript 文章截取部分无损html显示实现代码
2010/05/04 Javascript
js实现简单登录功能的实例代码
2013/11/09 Javascript
jquery中的on方法使用介绍
2013/12/29 Javascript
jquery实现文本框数量加减功能的例子分享
2014/05/10 Javascript
AngularJs中route的使用方法和配置
2016/02/04 Javascript
AngularJS 中的事件详解
2016/07/28 Javascript
图片上传之FileAPI与NodeJs
2017/01/24 NodeJs
Angular2 之 路由与导航详细介绍
2017/05/26 Javascript
详解利用 Vue.js 实现前后端分离的RBAC角色权限管理
2017/09/15 Javascript
ES6中新增的Object.assign()方法详解
2017/09/22 Javascript
Three.js利用Detector.js插件如何实现兼容性检测详解
2017/09/26 Javascript
webpack3之loader全解析
2017/10/26 Javascript
mint-ui在vue中的使用示例
2018/04/05 Javascript
vue-resource请求实现http登录拦截或者路由拦截的方法
2018/07/11 Javascript
详解Vue中的MVVM原理和实现方法
2020/07/15 Javascript
[01:48:04]DOTA2-DPC中国联赛 正赛 PSG.LGD vs Elephant BO3 第一场 2月7日
2021/03/11 DOTA
python静态方法实例
2015/01/14 Python
Python实现基于二叉树存储结构的堆排序算法示例
2017/12/08 Python
Python设计模式之装饰模式实例详解
2019/01/21 Python
对Python协程之异步同步的区别详解
2019/02/19 Python
Python HTML解析模块HTMLParser用法分析【爬虫工具】
2019/04/05 Python
结合CSS3的新特性来总结垂直居中的实现方法
2016/05/30 HTML / CSS
Roxy荷兰官方网站:冲浪、滑雪板、服装和配件
2019/10/22 全球购物
Linux开机引导的步骤是什么
2015/10/19 面试题
工程造价自荐信
2013/10/09 职场文书
杠杆的科学教学反思
2014/01/10 职场文书
英文自荐信常用句子
2014/03/26 职场文书
好习惯伴我成长演讲稿
2014/05/21 职场文书
公司演讲稿开场白
2014/08/25 职场文书
公司试用期员工自我评价
2014/09/17 职场文书
流动人口婚育证明
2014/10/19 职场文书
vue项目两种方式实现竖向表格的思路分析
2021/04/28 Vue.js