从节点初始化 jquery

Posted

技术标签:

【中文标题】从节点初始化 jquery【英文标题】:Initializing jquery from Node 【发布时间】:2015-10-17 17:59:51 【问题描述】:

我正在使用以下内容创建一个新项目:

$mkdir X
$cd X
$npm install jquery

然后新建一个app.js文件:

var http = require('http');
var $ = require('jquery');
console.log("http="+ http);
console.log("$="+ $);
console.log("$.getJSON="+ $.getJSON);

输出是:

http=[object Object]
$=function ( w ) ...
$.getJSON=undefined

为什么 $.getJSON 未定义?使用最新的 io.js v2.4.0。

【问题讨论】:

我怀疑 getJSON 在节点中不起作用。此代码在浏览器中完美运行。 看看这个(来自我)answer 它可能会澄清jquery + node 组合。 【参考方案1】:

您正在尝试从 Node.js 中创建 XHR。这是行不通的,因为 Node.js 只是一个 javascript 运行时,与浏览器不同。

如果您想通过 HTTP 协议从某处获取某些内容,您可以使用类似 request 的内容。例如(来自官方文档):

var request = require('request');
request('http://www.google.com', function (error, response, body) 
  if (!error && response.statusCode == 200) 
    console.log(body) // Show the html for the Google homepage. 
  
)

您可以查看this answer(也来自我),了解有关将 jQuery 与 Node.js 结合使用的更多信息。

UPDATE[d again!]:

所以您想知道 jQuery 节点模块如何区分浏览器和节点环境?当你在提供modulemodule.exports 的CommonJS 或类似环境中require jQuery 时,你得到的是一个工厂而不是实际的jQuery 对象。如下所示,该工厂可用于创建 jQuery 对象,即使用 jsdom:

let jsdom = require("jsdom");
let $ = null;

jsdom.env(
  "http://quaintous.com/2015/07/31/jquery-node-mystery/",
  function (err, window) 
    $ = require('jQuery')(window);
  
);

以下是 jQuery 区分浏览器和 io.js(或 Node.js)的方式:

(function( global, factory ) 

    if ( typeof module === "object" && typeof module.exports === "object" ) 
        // For CommonJS and CommonJS-like environments where a proper `window`
        // is present, execute the factory and get jQuery.
        // For environments that do not have a `window` with a `document`
        // (such as Node.js), expose a factory as module.exports.
        // This accentuates the need for the creation of a real `window`.
        // e.g. var jQuery = require("jquery")(window);
        // See ticket #14549 for more info.
        module.exports = global.document ?
            factory( global, true ) :
            function( w ) 
                if ( !w.document ) 
                    throw new Error( "jQuery requires a window with a document" );
                
                return factory( w );
            ;
     else 
        factory( global );
    

// Pass this if window is not defined yet
(typeof window !== "undefined" ? window : this, function( window, noGlobal ) 
  // implementation

  return jQuery;
));

我会使用 jQuery 的 npm 包用于 custom builds 而不是与 require 一起使用!

更新

我觉得这个主题恰好让一些开发人员忙得不可开交,所以我结合了我自己的几个答案并写了an article关于整个 jQuery/Node 组合!

【讨论】:

感谢您的参与!我理解 Node.js 是一个 JavaScript 引擎,与浏览器不同。但是,有一个一流的 Node.js npm 包。我不是想只使用一个随机的 js 文件,它可能(或不)是依赖于浏览器的。为无法使用它的代码创建 Node.Js 包有什么意义?这个页面(从 2012 年开始)似乎很容易,但方向不起作用:hacksparrow.com/jquery-with-node-js.html jQuery 在 DOM 解析和操作方面做得很好。您在那篇文章中看到的是解析和操作。但是,作为原生浏览器 API 包装器的所有其他功能(例如 ajax)在 node 中不起作用。 我明白了 - jquery 是否在后台检查托管环境并且它不初始化可能依赖于浏览器功能的函数(例如 getJSON)?它将解释为什么 jquery.getJSON 未从节点定义,但在浏览器中有效。 @loictregan 看看 jQuery 的 node 模块提供的文件。我在答案中添加了最重要的部分! @loictregan 很高兴我能帮上忙 :)【参考方案2】:

如果你想同步加载 jquery,你可以使用类似下面的东西

var jsdom  = require('jsdom');
var jQuery = require('jquery')(jsdom.jsdom('<p><a>jsdom!</a></p>').defaultView);

【讨论】:

以上是关于从节点初始化 jquery的主要内容,如果未能解决你的问题,请参考以下文章

jQuery事件处理,节点

jquery zTree 查找所有的叶子节点

从 SKS 文件加载节点时使用的初始化程序

jQuery从小白开始---初始jQuery

Nice Jquery Validator 从 jQuery Validation 迁移

一起学爬虫——PyQuery常用用法总结