Andy Andy - 2 years ago 192
HTML Question

Update HTML object with node.js and javascript

I'm new to nodejs and jquery, and I'm trying to update one single html object using a script.
I am using a Raspberry pi 2 and a ultrasonic sensor, to measure distance. I want to measure continuous, and update the html document at the same time with the real time values.

When I try to run my code it behaves like a server and not a client. Everything that i console.log() prints in the cmd and not in the browesers' console. When I run my code now i do it with "sudo node surveyor.js", but nothing happens in the html-document. I have linked it properly to the script. I have also tried document.getElementsByTagName("h6").innerHTML = distance.toFixed(2), but the error is "document is not defiend".

Is there any easy way to fix this?

My code this far is:

var statistics = require('math-statistics');
var usonic = require('r-pi-usonic');
var fs = require("fs");
var path = require("path");
var jsdom = require("jsdom");

var htmlSource = fs.readFileSync("../index.html", "utf8");

var init = function(config) {
usonic.init(function (error) {
if (error) {
} else {
var sensor = usonic.createSensor(config.echoPin, config.triggerPin, config.timeout);
var distances;

(function measure() {
if (!distances || distances.length === config.rate) {
if (distances) {

distances = [];

setTimeout(function() {

}, config.delay);

var print = function(distances) {
var distance = statistics.median(distances);


if (distance < 0) {
process.stdout.write('Error: Measurement timeout.\n');
} else {
process.stdout.write('Distance: ' + distance.toFixed(2) + ' cm');

call_jsdom(htmlSource, function (window) {
var $ = window.$;


function documentToSource(doc) {
// The non-standard window.document.outerHTML also exists,
// but currently does not preserve source code structure as well

// The following two operations are non-standard
return doc.doctype.toString()+doc.innerHTML;

function call_jsdom(source, callback) {
[ 'jquery-1.7.1.min.js' ],
function(errors, window) {
function () {
if (errors) {
throw new Error("There were errors: "+errors);

echoPin: 15, //Echo pin
triggerPin: 14, //Trigger pin
timeout: 1000, //Measurement timeout in ┬Ás
delay: 60, //Measurement delay in ms
rate: 5 //Measurements per sample

Answer Source

Node.js is a server-side implementation of JavaScript. It's ok to do all the sensors operations and calculations on server-side, but you need some mechanism to provide the results to your clients. If they are going to use your application by using a web browser, you must run a HTTP server, like Express.js, and create a route (something like http://localhost/surveyor or just http://localhost/) that calls a method you have implemented on server-side and do something with the result. One possible way to return this resulting data to the clients is by rendering an HTML page that shows them. For that you should use a Template Engine.

Any DOM manipulation should be done on client-side (you could, for example, include a <script> tag inside your template HTML just to try and understand how it works, but it is not recommended to do this in production environments).

Try searching google for Node.js examples and tutorials and you will get it :)

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download