ฉันสามารถใช้ jQuery กับ Node.js ได้หรือไม่


574

เป็นไปได้หรือไม่ที่จะใช้ตัวเลือก jQuery / การจัดการ DOM บนฝั่งเซิร์ฟเวอร์โดยใช้ Node.js


3
ฉันสงสัยว่า: ทำไมใช้บนฝั่งเซิร์ฟเวอร์ในขณะที่คุณสามารถทำได้บนฝั่งไคลเอ็นต์
Inanc Gumus

31
บางทีคุณอาจต้องการสร้างเว็บ scrapper ที่เก็บข้อมูลเฉพาะในช่วงเวลาปกติและเก็บผลลัพธ์ไว้ในฐานข้อมูล สิ่งนี้จะไม่เป็นประโยชน์จากฝั่งไคลเอ็นต์
เทรเวอร์

2
คุณควรดู phantomjs ซึ่งอนุญาตให้คุณเลียนแบบฝั่งเซิร์ฟเวอร์เบราว์เซอร์ด้วยเอ็นจิ้น V8
Dimitri Kopriwa

2
การจัดการ @deeperx DOM บนฝั่งเซิร์ฟเวอร์อาจเป็นประโยชน์เมื่อสร้างซอฟต์แวร์รวบรวมข้อมูล ดูคำตอบนี้
Lucio Paiva

ใช่ - ดูคำตอบนี้ - ฉันชอบมากกว่านี้โดยใช้ cheerio เนื่องจากคุณได้รับพลังเต็มรูปแบบของตัวเลือก jQuery
monika mevenkamp

คำตอบ:


563

Update (27-Jun-18) : ดูเหมือนว่ามีการอัปเดตที่สำคัญjsdomซึ่งทำให้คำตอบดั้งเดิมไม่สามารถใช้งานได้อีกต่อไป ฉันพบคำตอบนี้ซึ่งอธิบายถึงวิธีการใช้jsdomตอนนี้ ฉันได้คัดลอกรหัสที่เกี่ยวข้องด้านล่าง

var jsdom = require("jsdom");
const { JSDOM } = jsdom;
const { window } = new JSDOM();
const { document } = (new JSDOM('')).window;
global.document = document;

var $ = jQuery = require('jquery')(window);

หมายเหตุ:คำตอบดั้งเดิมล้มเหลวในการพูดถึงว่าคุณจะต้องติดตั้ง jsdom เช่นกันโดยใช้npm install jsdom

อัปเดต (ปลายปี 2013) : ทีมงาน jQuery อย่างเป็นทางการได้เข้ามามีส่วนร่วมในการจัดการjqueryแพคเกจในเวลา 17.00 น.:

npm install jquery

แล้ว:

require("jsdom").env("", function (err, window) {
    if (err) {
        console.error(err);
        return;
    }
    var $ = require("jquery")(window);
});


43
เป็นไปได้ไหมที่จะใช้ jQuery ajax จาก node.js กับโมดูล npm นั้น?
ajsie

22
ไม่ได้ติดตั้งบน Windows (โดยไม่มีการทำงานที่สำคัญ ) ซึ่งในกรณีนี้ฉันจะแนะนำโมดูล Cheerio: matthewmueller.github.com/cheerio
Simon East

7
+1 สำหรับการแสดงตำแหน่งที่จะได้รับ npm :) คนส่วนใหญ่มีนิสัยที่ไม่ดีเพียงแค่พูดถึงสิ่งต่าง ๆ ราวกับว่ามันควรจะเป็น (สามัญสำนึก)
Val

12
ผลตอบแทนrequire("...").env is not a functionนี้
Banderi

4
@ Banderi เดียวกันกับฉันความคิดใด ๆ ข้อผิดพลาด:TypeError: require(...).env is not a function
coderInrRain

58

ใช่คุณสามารถใช้ห้องสมุดที่ฉันสร้างขึ้นเรียกว่าnodeQuery

var Express = require('express')
    , dnode = require('dnode')
    , nQuery = require('nodeQuery')
    , express = Express.createServer();

var app = function ($) {
    $.on('ready', function () {
        // do some stuff to the dom in real-time
        $('body').append('Hello World');
        $('body').append('<input type="text" />');
        $('input').live('click', function () {
            console.log('input clicked');
            // ...
        });
    });
};

nQuery
    .use(app);

express
    .use(nQuery.middleware)
    .use(Express.static(__dirname + '/public'))
    .listen(3000);

dnode(nQuery.middleware).listen(express);

20
โปรดทราบว่า nodeQuery กำลังเปลี่ยนหน้าของผู้ใช้ในแบบเรียลไทม์ดังนั้นมันจึงเย็นกว่าที่คาดไว้
alessioalex

ฉันค้นหาสิ่งนี้เมื่อฉันสะดุดที่นี่ ... ฉันเพิ่งดูแพคเกจโหนด nQuery และ jquery และ nQuery ได้รับการอัปเดตเมื่อปีที่แล้วที่ jQuery เป็นเมื่อวานนี้ ... nQuery ไม่ได้รับการพัฒนาอีกต่อไปหรือไม่ และ jquery ส่งผลกระทบต่อฝั่งไคลเอ็นต์เหมือน nQuery หรือไม่? มีใครลองพวกเขาทั้งสองอาจจะ?
Logan

2
@Logan nQuery นั้นเป็นเพียงแค่ jquery ความแตกต่างคือรหัสจะถูกเรียกใช้บนเซิร์ฟเวอร์และแทนที่จะส่งรหัส jquery ไปยังเบราว์เซอร์จะเรียกใช้รหัสบนเซิร์ฟเวอร์และดำเนินการจัดการจากระยะไกลไปยังเบราว์เซอร์ที่เชื่อมต่อ โปรดทราบด้วยว่า nQuery เป็นโครงการทดลองและในขณะที่ฉันจะยอมรับคำขอดึงเพื่อแก้ไขข้อบกพร่องมันไม่เคยถูกสร้างขึ้นเพื่อวัตถุประสงค์เฉพาะหรือโครงการใด ๆ ดังนั้นจึงไม่ได้มีข้อผูกพันมากมาย
Thomas Blobaum

@ThomasBlobaum ไม่ทำงานสำหรับฉันข้อผิดพลาด: , express = Express.createServer();และTypeError: Express.createServer is not a functionความคิดใด ๆ
coderInrRain

@ThomasBlobaum ดูเหมือนว่าคุณยังไม่มี Express เวอร์ชันล่าสุด ลองnpm install --save expressในพรอมต์คำสั่งของคุณ
gilbert-v

55

ในขณะที่เขียนยังมีCheerioบำรุงรักษาอยู่

การปรับใช้ core jQuery ที่รวดเร็วยืดหยุ่นและแบบลีนออกแบบมาสำหรับเซิร์ฟเวอร์โดยเฉพาะ


2
+1 สำหรับ Cheerio ในทางกลับกัน jsdom นั้นเจ็บปวดมากที่ใช้ Windows
Simon East

1
Cheerio สามารถใช้กิจกรรมรอการตัดบัญชีและการโทร ajax ได้หรือไม่
Hoffmann

6
ไม่รองรับตัวเลือกจำนวนมากเช่น:gt(1)
chovy

1
จากประสบการณ์ของฉันอันนี้ใช้ได้ดีที่สุด มันเร็วกว่า JSDOM มาก
Jason Prawn

1
@ ฮอฟมันน์ฉันใช้เวลาสักครู่เพื่อตรวจสอบเอกสารให้คุณ ไม่มันไม่ Cheerio มีวิธีการที่เกี่ยวข้องกับ DOM เท่านั้น
เดนิส

39

ใช้jsdomตอนนี้คุณสามารถ เพียงแค่ดูตัวอย่าง jquery ในไดเรกทอรีตัวอย่าง


อีกด้านหนึ่งของ jQuery's jQueryify () คือมันรันสคริปต์ทั้งหมดของหน้าเว็บ
drewish

และมันไม่ทำงานบน Windows โดยไม่มีอาการปวดหัวมากมาย
Jason Goemaat

1
ในปี 2559 คุณไม่ต้องการ jsdom อีกต่อไป - ดูคำตอบของฉัน: stackoverflow.com/a/40656811/3391783
low_rents

34

โปรแกรมรวบรวมข้อมูลอย่างง่ายโดยใช้ Cheerio

นี่เป็นสูตรของฉันในการสร้างโปรแกรมรวบรวมข้อมูลอย่างง่าย ๆ ใน Node.js นี่เป็นเหตุผลหลักที่ทำให้คุณต้องการจัดการ DOM บนฝั่งเซิร์ฟเวอร์และอาจเป็นสาเหตุที่คุณมาที่นี่

ก่อนอื่นให้ใช้ requestเพื่อดาวน์โหลดหน้าเพื่อแยกวิเคราะห์ เมื่อการดาวน์โหลดเสร็จสิ้นให้จัดการcheerioและเริ่มการจัดการ DOM เช่นเดียวกับการใช้ jQuery

ตัวอย่างการทำงาน:

var
    request = require('request'),
    cheerio = require('cheerio');

function parse(url) {
    request(url, function (error, response, body) {
        var
            $ = cheerio.load(body);

        $('.question-summary .question-hyperlink').each(function () {
            console.info($(this).text());
        });
    })
}

parse('http://stackoverflow.com/');

ตัวอย่างนี้จะพิมพ์ไปยังคอนโซลคำถามยอดนิยมทั้งหมดที่แสดงในหน้าแรกดังนั้น นี่คือเหตุผลที่ฉันรัก Node.js และชุมชน มันไม่ง่ายไปกว่านั้น :-)

ติดตั้งการพึ่งพา:

ขอติดตั้ง NPM เชียร์

และเรียกใช้ (สมมติว่าสคริปต์ด้านบนอยู่ในไฟล์ crawler.js ):

node crawler.js


การเข้ารหัส

บางหน้าจะมีเนื้อหาที่ไม่ใช่ภาษาอังกฤษในการเข้ารหัสบางอย่างและคุณจะต้องถอดรหัสให้UTF-8เป็น ตัวอย่างเช่นหน้าในภาษาบราซิลโปรตุเกส (หรือภาษาอื่น ๆ ที่มีต้นกำเนิดละติน) จะถูกเข้ารหัสในISO-8859-1(aka "latin1") เมื่อต้องการถอดรหัสฉันrequestไม่บอกให้ตีความเนื้อหาในทางใดทางหนึ่งและใช้แทนiconv-liteเพื่อทำงานแทน

ตัวอย่างการทำงาน:

var
    request = require('request'),
    iconv = require('iconv-lite'),
    cheerio = require('cheerio');

var
    PAGE_ENCODING = 'utf-8'; // change to match page encoding

function parse(url) {
    request({
        url: url,
        encoding: null  // do not interpret content yet
    }, function (error, response, body) {
        var
            $ = cheerio.load(iconv.decode(body, PAGE_ENCODING));

        $('.question-summary .question-hyperlink').each(function () {
            console.info($(this).text());
        });
    })
}

parse('http://stackoverflow.com/');

ก่อนรันให้ติดตั้งการพึ่งพา:

คำขอติดตั้ง npm iconv-lite เชียร์

และในที่สุดก็:

node crawler.js


ลิงค์ต่อไปนี้

ขั้นตอนต่อไปคือติดตามลิงก์ สมมติว่าคุณต้องการแสดงรายชื่อผู้โพสต์ทั้งหมดจากคำถามยอดนิยมแต่ละข้อเกี่ยวกับ SO คุณต้องแสดงรายการคำถามยอดนิยมทั้งหมดก่อน (ตัวอย่างข้างต้น) จากนั้นป้อนแต่ละลิงก์แยกวิเคราะห์หน้าคำถามแต่ละข้อเพื่อรับรายการผู้ใช้ที่เกี่ยวข้อง

เมื่อคุณเริ่มติดตามลิงก์นรกโทรกลับสามารถเริ่มต้นได้ เพื่อหลีกเลี่ยงปัญหานี้คุณควรใช้สัญญาบางอย่างฟิวเจอร์สหรืออะไรก็ตาม ฉันมักจะให้asyncในแถบเครื่องมือของฉัน ดังนั้นนี่คือตัวอย่างเต็มรูปแบบของโปรแกรมรวบรวมข้อมูลที่ใช้ async:

var
    url = require('url'),
    request = require('request'),
    async = require('async'),
    cheerio = require('cheerio');

var
    baseUrl = 'http://stackoverflow.com/';

// Gets a page and returns a callback with a $ object
function getPage(url, parseFn) {
    request({
        url: url
    }, function (error, response, body) {
        parseFn(cheerio.load(body))
    });
}

getPage(baseUrl, function ($) {
    var
        questions;

    // Get list of questions
    questions = $('.question-summary .question-hyperlink').map(function () {
        return {
            title: $(this).text(),
            url: url.resolve(baseUrl, $(this).attr('href'))
        };
    }).get().slice(0, 5); // limit to the top 5 questions

    // For each question
    async.map(questions, function (question, questionDone) {

        getPage(question.url, function ($$) {

            // Get list of users
            question.users = $$('.post-signature .user-details a').map(function () {
                return $$(this).text();
            }).get();

            questionDone(null, question);
        });

    }, function (err, questionsWithPosters) {

        // This function is called by async when all questions have been parsed

        questionsWithPosters.forEach(function (question) {

            // Prints each question along with its user list
            console.info(question.title);
            question.users.forEach(function (user) {
                console.info('\t%s', user);
            });
        });
    });
});

ก่อนใช้งาน:

npm ขอให้ติดตั้ง async cheerio

ทำการทดสอบ:

node crawler.js

ตัวอย่างผลลัพธ์:

Is it possible to pause a Docker image build?
    conradk
    Thomasleveil
PHP Image Crop Issue
    Elyor
    Houston Molinar
Add two object in rails
    user1670773
    Makoto
    max
Asymmetric encryption discrepancy - Android vs Java
    Cookie Monster
    Wand Maker
Objective-C: Adding 10 seconds to timer in SpriteKit
    Christian K Rider

และนั่นเป็นพื้นฐานที่คุณควรรู้ในการเริ่มสร้างซอฟต์แวร์รวบรวมข้อมูลของคุณเอง :-)


ห้องสมุดที่ใช้


22

ในปี 2559 สิ่งต่าง ๆ ง่ายขึ้น ติดตั้ง jquery ไปยัง node.js ด้วยคอนโซลของคุณ:

npm install jquery

ผูกกับตัวแปร$(เช่น - ฉันคุ้นเคยกับมัน) ในรหัส node.js ของคุณ:

var $ = require("jquery");

ทำสิ่งที่:

$.ajax({
    url: 'gimme_json.php',
    dataType: 'json',
    method: 'GET',
    data: { "now" : true }
});

ยังใช้งานได้สำหรับอึกตามที่อยู่บน node.js


คุณใช้โหนดรุ่นใด สำหรับ Mac, Node 6.10.2, jquery 2.2.4, var $ = require("jquery"); $.ajax // undefined (ลดลงชั่วขณะ)
AJP

@AJP และคุณแน่ใจหรือว่าคุณnpm install jqueryเป็นคนแรก?
low_rents

1
ใช่. > console.log(require("jquery").toString());ให้ฟังก์ชั่นโรงงาน: function ( w ) { if ( !w.document ) { throw new Error( "jQuery requires a window with a document" ); } return factory( w ); } ฉันต้องใช้คำตอบข้างต้นกับ jsdom: stackoverflow.com/a/4129032/539490
AJP

@AJP โอเคมันแปลกนะ
low_rents

ฉันได้รับฟังก์ชั่นจากโรงงานเหมือนกับที่ @AJP ทำ คุณใช้ jquery เวอร์ชันใดแล้ว @low_rents
Boris Burkov

18

ฉันเชื่อว่าคำตอบนี้คือใช่
https://github.com/tmpvar/jsdom

var navigator = { userAgent: "node-js" };  
var jQuery = require("./node-jquery").jQueryInit(window, navigator);

9
ฉันขอโทษที่รายงานว่าจะต้องใช้เวลามากขึ้นในการทำให้ jQuery ทำงานบน jsdom เสียงดังฉ่า ๆ ใช้งานได้! ฉันต้องการให้ jsdom มีน้ำหนักเบาที่สุดเท่าที่จะเป็นไปได้ดังนั้นการเพิ่มการจำลองเบราว์เซอร์แบบเต็มเช่น env.js ไม่ได้เป็นลำดับความสำคัญในขณะนี้
tmpvar

ไม่เป็นไรฉันพบสำเนาดัดแปลงที่รวมกับ jsdom
drewish

FYI node-jquery เลิกใช้แล้วตอนนี้เพราะ jquery
Ruslan López

1
ReferenceError: หน้าต่างไม่ได้ถูกกำหนด
บอนน์

17

npm install jquery --save #note LOWERCASE ทั้งหมด

npm install jsdom --save

const jsdom = require("jsdom");
const dom = new jsdom.JSDOM(`<!DOCTYPE html>`);
var $ = require("jquery")(dom.window);


$.getJSON('https://api.github.com/users/nhambayi',function(data) {
  console.log(data);
});

นี่คือคำตอบที่เรียบร้อย! กรุณา
โหวต

8

โมดูล jQuery สามารถติดตั้งได้โดยใช้:

npm install jquery

ตัวอย่าง:

var $ = require('jquery');
var http = require('http');

var options = {
    host: 'jquery.com',
    port: 80,
    path: '/'
};

var html = '';
http.get(options, function(res) {
res.on('data', function(data) {
    // collect the data chunks to the variable named "html"
    html += data;
}).on('end', function() {
    // the whole of webpage data has been collected. parsing time!
    var title = $(html).find('title').text();
    console.log(title);
 });
});

การอ้างอิงของ jQuery ใน Node.js **:


2
ไม่ทำงานสำหรับฉัน ... C: \ ... \\ node_modules \ jquery \ dist \ jquery.js: 31 มีข้อผิดพลาดใหม่ ("jQuery ต้องใช้หน้าต่างที่มีเอกสาร"); ^ ข้อผิดพลาด: jQuery ต้องการหน้าต่างพร้อมเอกสารที่ module.exports (C: \ ... \ WebContent \ resources \ js \ node_modules \ jquery \ dist \ jquery.js: 31: 12)
Jose Manuel Gomez Alvarez

var jsdom = ต้องการ ("jsdom"); var window = jsdom.jsdom (). defaultView; jsdom.jQueryify (หน้าต่าง " code.jquery.com/jquery.js ", ฟังก์ชั่น () {var $ = หน้าต่าง. $; $ ("ร่างกาย"). prepend ("<h1> ชื่อเรื่อง </h1>") ; console.log ($ ("h1"). html ());});
SUNDARRAJAN K

7

คุณต้องรับหน้าต่างโดยใช้ JSDOM API ใหม่

const jsdom = require("jsdom");
const { window } = new jsdom.JSDOM(`...`);
var $ = require("jquery")(window);

.JSDOM ( ...) ควรเป็น. JSDOM ("<! DOCTYPE html>") สำหรับการสนับสนุน HTML5 หรือไม่
datdinhquoc

2

คำเตือน

การแก้ปัญหานี้เป็นที่กล่าวถึงโดยGolo โรไม่ถูกต้อง เป็นการแก้ไขด่วนเพื่อช่วยให้ผู้ใช้เรียกใช้รหัส jQuery จริงโดยใช้โครงสร้างแอป Node แต่ไม่ใช่ปรัชญาของ Node เนื่องจาก jQuery ยังคงทำงานบนฝั่งไคลเอ็นต์แทนฝั่งเซิร์ฟเวอร์ ฉันขอโทษที่ให้คำตอบที่ผิด


คุณสามารถแสดงผล Jade ด้วยโหนดและใส่รหัส jQuery ของคุณ นี่คือรหัสของไฟล์ Jade:

!!! 5
html(lang="en")
  head
    title Holamundo!
    script(type='text/javascript', src='http://code.jquery.com/jquery-1.9.1.js')
  body
    h1#headTitle Hello, World
    p#content This is an example of Jade.
    script
      $('#headTitle').click(function() {
        $(this).hide();
      });
      $('#content').click(function() {
        $(this).hide();
      });

4
ลดลงเนื่องจากคำถามระบุอย่างชัดเจนว่าเป็นเรื่องเกี่ยวกับ jQuery บนฝั่งเซิร์ฟเวอร์ เพียงแค่ฝัง jQuery ลงในไฟล์ Jade jQuery ก็ยังคงรันบนฝั่งไคลเอ็นต์ ดังนั้นคำตอบนี้ไม่ได้ช่วย: - /
Golo Roden

2
โอเคขอบคุณมาก. ฉันเข้าใจแล้ว ฉันจะพยายามอธิบายให้ชัดเจนในคำตอบเพื่อไม่ให้คนที่อ่านสับสน ขอบคุณอีกครั้งสำหรับความช่วยเหลือของคุณ Golo
Timbergus

2
ยินดีต้อนรับคุณ :-) และไม่เป็นไร: เราทำผิดพลาดดังนั้นไม่ต้องกังวล :-)
Golo Roden

2

รหัสการทำงานของฉันคือ:

npm install jquery

แล้ว:

global.jQuery   = require('jquery');
global.$        = global.jQuery;

หรือหากมีหน้าต่างอยู่แสดงว่า:

typeof window !== "undefined" ? window : this;
window.jQuery   = require('jquery');
window.$        = window.jQuery;

1

โมดูลjsdomเป็นเครื่องมือที่ยอดเยี่ยม แต่ถ้าคุณต้องการประเมินทั้งหน้าและทำสิ่งที่ขี้ขลาดบนฝั่งเซิร์ฟเวอร์ฉันแนะนำให้ใช้พวกเขาในบริบทของตนเอง:

vm.runInContext

ดังนั้นสิ่งที่ชอบrequire/CommonJSบนไซต์จะไม่ทำให้กระบวนการ Node ของคุณเสียเอง

คุณสามารถค้นหาเอกสารที่นี่ ไชโย!


1

ตั้งแต่ jsdom v10 ฟังก์ชัน. env () เลิกใช้แล้ว ฉันทำเช่นนี้หลังจากพยายามทำสิ่งต่างๆมากมายเพื่อต้องการ jQuery:

var jsdom = require('jsdom');
const { JSDOM } = jsdom;
const { window } = new JSDOM();
const { document } = (new JSDOM('')).window;
global.document = document;

var $ = jQuery = require('jquery')(window);

หวังว่านี่จะช่วยคุณหรือใครก็ตามที่ประสบปัญหาประเภทนี้


TypeError: JSDOM is not a constructor
Nathan Hawks

หากคุณใช้ jQuery ที่ฝั่งโหนดอันดับแรกให้ติดตั้ง jquery และ jsdom โดยใช้การติดตั้ง npm จากนั้นให้เพิ่มดังกล่าวข้างต้นบรรทัดในไฟล์ที่คุณกำลังพยายามที่จะใช้ตัวเลือกใน jQuery. $.eachยกตัวอย่างเช่นผมใช้ ฉันเพิ่งรวมบรรทัดเหล่านี้แล้วทำเช่นนี้: $.each(errors, function (ind,error) { res.send(error.msg);console.log(error.msg); }); หวังว่านี่จะช่วยได้ !!
Plabon Dutta

อย่างใด jsdom ตัดสินใจที่จะไม่ติดตั้งเลย ฉันเดาว่าฉันยังคงคิด npm อยู่ Thanks @
Nathan Hawks

1

ก่อนอื่นให้ทำการติดตั้ง

npm install jquery -S

หลังจากติดตั้งแล้วคุณสามารถใช้งานได้ดังต่อไปนี้

import $ from 'jquery';
window.jQuery = window.$ = $;
$(selector).hide();

คุณสามารถตรวจสอบการสอนเต็มรูปแบบที่ฉันเขียนไว้ที่นี่: https://medium.com/fbdevclagos/how-to-use-jquery-on-node-df731bd6abc7


0

วิธีแก้ปัญหาเหล่านี้ไม่ได้ช่วยฉันในแอพอิเล็กตรอน

โซลูชันของฉัน (วิธีแก้ปัญหา):

npm install jquery

ในindex.jsไฟล์ของคุณ:

var jQuery = $ = require('jquery');

ใน.jsไฟล์ของคุณเขียนฟังก์ชั่น jQuery ของคุณด้วยวิธีนี้:

jQuery(document).ready(function() {

0

ใช่สามารถใช้กับjQueryNode.js

ขั้นตอนในการรวม jQuery ในโปรเจ็กต์โหนด: -

npm i jquery --save รวม jquery ในรหัส

import jQuery from 'jquery';

const $ = jQuery;

ฉันใช้ jquery ในโครงการ node.js ตลอดเวลาโดยเฉพาะในโครงการส่วนขยายของ chrome

เช่นhttps://github.com/fxnoob/gesture-control-chrome-extension/blob/master/src/default_plugins/tab.js


-1

ไม่มันเป็นความพยายามอย่างมากในการปรับสภาพแวดล้อมของเบราว์เซอร์ไปยังโหนด

อีกวิธีหนึ่งที่ฉันกำลังตรวจสอบการทดสอบหน่วยคือการสร้าง jQuery เวอร์ชัน "จำลอง" ที่ให้การโทรกลับเมื่อใดก็ตามที่มีการเรียกตัวเลือก

วิธีนี้คุณสามารถทดสอบปลั๊กอิน jQuery ของคุณโดยไม่ต้องมี DOM คุณจะต้องทดสอบในเบราว์เซอร์จริง ๆ เพื่อดูว่ารหัสของคุณใช้งานได้จริงหรือไม่ แต่ถ้าคุณค้นพบปัญหาเฉพาะของเบราว์เซอร์คุณสามารถ "จำลอง" สิ่งเหล่านั้นในการทดสอบหน่วยของคุณ

ฉันจะผลักดันบางสิ่งเพื่อ github.com/felixge เมื่อพร้อมที่จะแสดง


ฉันชอบความคิดนี้ ... มันค่อนข้างง่ายที่จะทำ
Sudhir Jonathan

-1

คุณสามารถใช้อิเล็กตรอนมันช่วยให้ลูกผสม browserjs และ nodejs

ก่อนหน้านี้ฉันพยายามใช้ canvas2d ใน nodejs แต่สุดท้ายฉันก็ยอมแพ้ ไม่ได้รับการสนับสนุนโดยค่าดีฟอลต์ของ nodejs และยากเกินกว่าจะติดตั้งได้ จนกว่าฉันจะใช้อิเล็กตรอนฉันสามารถใช้รหัส browserjs ก่อนหน้านี้ทั้งหมดของฉันได้อย่างง่ายดายแม้กระทั่ง WebGL และส่งค่าผลลัพธ์ (เช่นข้อมูลภาพ base64 ผลลัพธ์) ไปยังรหัส nodejs


-9

ไม่ใช่ที่ฉันรู้ DOM คือสิ่งที่ฝั่งไคลเอ็นต์ (jQuery ไม่แยกวิเคราะห์ HTML แต่เป็น DOM)

นี่คือโครงการ Node.js ปัจจุบัน:

https://github.com/ry/node/wiki ( https://github.com/nodejs/node )

และ djangode ของSimonWนั้นเจ๋งทีเดียว ...


ฉันหวังว่ามันจะเป็นไปได้ ฉันได้ลองใส่ jquery ในโปรเจค node.js และแน่นอนว่ามันไม่ได้ผล jQuery ขึ้นอยู่กับเอกสาร / หน้าต่าง แรดสามารถเรียกใช้ฝั่งเซิร์ฟเวอร์ jQuery: ejohn.org/blog/bringing-the-browser-to-the-server ฉันจะมองหา parsers เพิ่มเติม อาจมีบางอย่างที่ไม่ได้ขึ้นอยู่กับเบราว์เซอร์
จอห์น

@John: เหตุผลเดียวที่ jQuery สามารถเรียกใช้บน Rhino เป็นเพราะโครงการนี้: github.com/jeresig/env-js/blob/master/src/env.js มันจำลองส่วนเล็ก ๆ ของ DOM และรันไทม์ JavaScript มันขึ้นอยู่กับ Java apis ดังนั้นจึงเป็น no-go สำหรับ Node.js (ซึ่งใช้ V8 / C ++)
Crescent Fresh

2
@Nosredna แม้ว่าสิ่งนี้อาจเป็นจริงเมื่อคุณเขียน แต่ก็ไม่ชัดเจนอีกต่อไป ฉันขอแนะนำให้คุณลบคำตอบของคุณตอนนี้
Keith Pinson

-18

ทางเลือกคือการใช้Underscore.js ควรให้สิ่งที่คุณอาจต้องการฝั่งเซิร์ฟเวอร์จาก JQuery


10
คุณสามารถอธิบาย? jQuery มี API การจัดการ / การสำรวจเส้นทาง / การกรอง API จำนวนมาก การขีดเส้นใต้ดูเหมือนว่าโปรแกรมอรรถประโยชน์ไลบรารีทั่วไปไม่มีส่วนเกี่ยวข้องกับ DOM
Peter Lyons

1
กันที่นี่ฉันไม่เห็นว่าสิ่งนี้เกี่ยวข้องกับทั้งสองอย่างเติมเต็มไม่ใช่ทางเลือก
Yi Jiang

2
คำตอบนี้ไม่ผิดทั้งหมด jQuery และ Underscore มีการเหลื่อมกัน: ทั้งคู่มีคุณสมบัติเช่น forEach
tuomassalo

8
-1 พวกเขามีฟังก์ชั่นที่ทับซ้อนกัน แต่ขีดล่างไม่ใช่ jQuery แทน
Sam

2
คำถามนี้ถามเกี่ยวกับการจัดการ / ตัวเลือก DOM
mikermcneil
โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.