I have a lot of static pages that I want to edit in some uniform manner, rename or adding classes for example. Now, jQuery allows me to do such operations in a manner that I'm very familiar with, but on the client side. Now I would like to do this in development; pick up a static web page, change something using jquery and save it again to disk. Is there a simple way to set up jQuery (and probably node.js) to allow this?
Asked
Active
Viewed 80 times
2
-
jQuery works on the level of DOM, not text, so this approach would look like HTML -> DOM -> (work) -> DOM -> HTML which could possibly lose some information in the translation. – Kos Dec 10 '13 at 08:55
-
That would not be optimal, unless you are scraping the web. You can use templates for this, dynamically passing an view object and rendering the page from it. – user568109 Dec 10 '13 at 09:05
-
what about this http://nodize.com/ – Dev Dec 10 '13 at 09:17
-
Set up nodeJS with the [jsdom](https://github.com/tmpvar/jsdom) package. – A1rPun Dec 10 '13 at 09:24
-
What kind of information would be lost in such translation @Kos? If the html is well formed it should come through the same? Give or take some whitespace? – worldsayshi Dec 10 '13 at 10:38
-
@worldsayshi Whatever isn't a part of the DOM. Comments, maybe some syntax nuances that a parser didn't catch (graceful degradation etc) – Kos Dec 10 '13 at 10:53
2 Answers
2
You can do it using jquery for node https://github.com/coolaj86/node-jquery
// install
npm install jquery
// usage:
var $ = require('jquery');
var inputHtml = '<html><body></body></html>';
var $html = $(inputHtml);
/* change background to red */
$html.find('body').css('background-color', 'red');
/* get back html string*/
var outputHtml = $html.find('body').parent()[0].outerHTML;
console.log(outputHtml);
//console
$ node jquery-test
<html><body style="background-color: red;"></body></html>
node-jquery is slow, and not async, do not call it directly in side http handler, but it is good for webcrawler, and offline processing.

damphat
- 18,246
- 8
- 45
- 59
-
Hmm, changing css properties shouldn't effect the html? I got your point though. Thanks! This would probably be a better example operation: `$html.find('body').addClass('myClass');` – worldsayshi Dec 10 '13 at 10:44
-
1I have just modified the example code, it work on my computer, windows8, node#0.10.20, jquery#1.8.3 – damphat Dec 10 '13 at 11:16