npm install -g express
npm install express
npm install express --save if you using a package.json file to track your project
<!DOCTYPE html>
<html>
<script src="scripts/angular.min.js"></script>
<body>
<div data-ng-app="" data-ng-init="names=['employee1','employee2','employee3']">
<p>Looping with ng-repeat:</p>
<ul>
<li data-ng-repeat="employee in names">
{{ employee }}
</li>
</ul>
</div>
</body>
</html>
module.exports = function (grunt) {
grunt.initConfig({
//create task execute
execute: {
target: {
src: ['connectNode.js']
}
},
//watch for changes in connectNode.js file and execute the task "execute"
watch: {
scripts: {
files: ['connectNode.js'],
tasks: ['execute'],
},
}
});
//loading necessary node packages
grunt.loadNpmTasks('grunt-contrib-watch');
grunt.loadNpmTasks('grunt-execute');
};
npm install mysql
var mysql = require("mysql");
<div class="outer_container">
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
</div>
var fs = require("fs");
fs.readFile('file.txt', function (err, data) {
if (err) return console.error(err);
console.log(data.toString());
});
console.log("Task Finished");
<!DOCTYPE html>
<html>
<script src="scripts/angular.min.js"></script>
<body>
<div ng-app="myApp" my-directive></div>
<script>
var app = angular.module("myApp", []);
app.directive("myDirective", function() {
return {
template : "This is a my own directive"
};
});
</script>
</body>
</html>
var app = angular.module("myApp", []);
var myServer=http.createServer(function(request,response){ response.writeHead(200,{"Content-Type":"text/plain"}); response.write("Hello World"); //writing a string to response response.end(); });//create server
var http=require('http'); // add the http module
var myServer=http.createServer(function(request,response){
response.writeHead(200,{"Content-Type":"text/plain"});
response.write("Hello World"); //writing a response to String
response.end();
});//create server
myServer.listen(3000); //assign a port to listen
// Console will print the message
console.log('listening at port 3000');
$("p:first").css("border","3px solid red");$("p:last").css("border","3px solid red");$("p:odd").css("border","3px solid red");$("p:even").css("border","3px solid red");$("p:gt(1)").css("border","3px solid red");$("p:eq(1)").css("border","3px solid red");$("p:not(p:eq(1))").css("border","3px solid red");| Filter | Purpose |
|---|---|
| :first | selects only the first instance of the selector's returned set |
| :last | selects only the last instance of the selector's returned set |
| :even | selects only even numbered elements of the selector's returned set |
| :odd | selects only odd numbered elements of the selector's returned set |
| :eq(n) | filters out elements that are positioned at the given index |
| :gt(n) | include elements that are past the given index |
| :lt(n) | include elements that are before the given index |
| :header | select all header elements (H1, H2, H3 etc) |
| :animated | selects all elements that are currently being animated in some way |
| :not(selector) | includes elements that do not match the given selector |
$(window).scroll(function() {
if($(window).scrollTop() > 0) {
$('#maincontent').css("background","gray");
} else {
$('#maincontent').css("background","white");
alert("Now you are in the top");
}
});
<body onscroll="bodyScroll();"></body>
bodyScroll() function function bodyScroll() {
$('#maincontent').css('background-color','lightGrey');
if (scrollTimer != -1)
clearTimeout(scrollTimer);
scrollTimer = window.setTimeout("scrollFinished()", 300);
}
scrollFinished() method. function scrollFinished() {
$('#maincontent').css("background","white");
}
<!DOCTYPE html>
<html>
<head>
<style>
.imagegrid{
border: 3px solid black;
padding: 10px;
}
img{
border: 1px solid red;
margin: 10px;
}
</style>
</head>
<body>
<h2>Image Grid</h2>
<div class="imagegrid">
<img src="Images/facebook.ico">
<img src="Images/google.ico">
<img src="Images/Linkedin-icon.png">
<img src="Images/twitter-icon.png">
</div>
</body>
</html>
var myNode= document.querySelector('.imagegrid');
myNode.addEventListener("click",function(e){
if(e.target.tagName==="IMG"){
alert(e.target.src+" clicked");
}
},false);
$("p, li.b").css("border","3px solid red");
$("ul li.a").css("border","3px solid red");
$("ul+p").css("border","3px solid red");
$("#list1 ~ p").css("border","3px solid red");
<!DOCTYPE html >
<html>
<head>
<title>Document</title>
<script type="text/javascript" src="Scripts/jquery-1.11.3.js"></script>
<script >
$("document").ready(function(){
//Your jquery code run when document is ready
});
</script>
<style type="text/css">
.a { color: Navy; }
.b { color: Maroon; }
</style>
</head>
<body>
<ul id="list1">
<li class="a">item 1</li>
<li class="a">item 2</li>
<li class="b">item 3</li>
<li class="b">item 4</li>
</ul>
<p class="a">This is paragraph 1</p>
<p>This is paragraph 2</p>
<p class="b">This is paragraph 3</p>
<p>This is paragraph 4</p>
</body>
</html>
$("p").css("border","3px solid red");
$("#list1").css("border","3px solid red");
This will get all elements that has ID of "list1" and put a red border around it
$(".a").css("border","3px solid red");
$("p.b").css("border","3px solid red");