Scribd
Upload
7K views

Time Zones: Example

This document discusses time zones in JavaScript and provides examples of how dates are converted to the browser's time zone. It warns that using non-standard date formats like YYYY/MM/DD can cause errors or return NaN in some browsers. It also covers four jQuery methods for adding new content to HTML elements: append() inserts at the end, prepend() at the beginning, after() inserts after, and before() inserts before. Examples are given for each method.

Uploaded by

Bogdan Chindris
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
7K views

Time Zones: Example

This document discusses time zones in JavaScript and provides examples of how dates are converted to the browser's time zone. It warns that using non-standard date formats like YYYY/MM/DD can cause errors or return NaN in some browsers. It also covers four jQuery methods for adding new content to HTML elements: append() inserts at the end, prepend() at the beginning, after() inserts after, and before() inserts before. Examples are given for each method.

Uploaded by

Bogdan Chindris
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 5

Time Zones

When setting a date, without specifying the time zone, JavaScript will use the
browser's time zone.

When getting a date, without specifying the time zone, the result is converted
to the browser's time zone.

In other words: If a date/time is created in GMT (Greenwich Mean Time), the


date/time will be converted to CDT (Central US Daylight Time) if a user browses
from central US.

JavaScript Short Dates.


Short dates are written with an "MM/DD/YYYY" syntax like this:

Example
var d = new Date("03/25/2015");
Try it Yourself »

WARNINGS !
In some browsers, months or days with no leading zeroes may produce an
error:

var d = new Date("2015-3-25");

The behavior of "YYYY/MM/DD" is undefined.


Some browsers will try to guess the format. Some will return NaN.

var d = new Date("2015/03/25");

The behavior of "DD-MM-YYYY" is also undefined.


Some browsers will try to guess the format. Some will return NaN.

var d = new Date("25-03-2015");


dd New HTML Content
We will look at four jQuery methods that are used to add new content:

 append() - Inserts content at the end of the selected elements


 prepend() - Inserts content at the beginning of the selected elements
 after() - Inserts content after the selected elements
 before() - Inserts content before the selected elements

jQuery append() Method


The jQuery append() method inserts content AT THE END of the selected HTML
elements.

Example
$("p").append("Some appended text.");

Try it Yourself »

jQuery prepend() Method


The jQuery prepend() method inserts content AT THE BEGINNING of the
selected HTML elements.

Example
$("p").prepend("Some prepended text.");

Try it Yourself »
Add Several New Elements With append() and
prepend()
In both examples above, we have only inserted some text/HTML at the
beginning/end of the selected HTML elements.

However, both the append() and prepend() methods can take an infinite
number of new elements as parameters. The new elements can be generated
with text/HTML (like we have done in the examples above), with jQuery, or with
JavaScript code and DOM elements.

In the following example, we create several new elements. The elements are
created with text/HTML, jQuery, and JavaScript/DOM. Then we append the new
elements to the text with the append() method (this would have worked
for prepend() too) :

Example
function appendText() {
var txt1 = "<p>Text.</p>"; // Create element with HTML
var txt2 = $("<p></p>").text("Text."); // Create with jQuery
var txt3 = document.createElement("p"); // Create with DOM
txt3.innerHTML = "Text.";
$("body").append(txt1, txt2, txt3); // Append the new elements
}

Try it Yourself »

jQuery after() and before() Methods


The jQuery after() method inserts content AFTER the selected HTML elements.

The jQuery before() method inserts content BEFORE the selected HTML
elements.

Example
$("img").after("Some text after");

$("img").before("Some text before");


Try it Yourself »

Add Several New Elements With after() and


before()
Also, both the after() and before() methods can take an infinite number of
new elements as parameters. The new elements can be generated with
text/HTML (like we have done in the example above), with jQuery, or with
JavaScript code and DOM elements.

In the following example, we create several new elements. The elements are
created with text/HTML, jQuery, and JavaScript/DOM. Then we insert the new
elements to the text with the after() method (this would have worked
for before() too) :

Example
function afterText() {
var txt1 = "<b>I </b>"; // Create element with HTML
var txt2 = $("<i></i>").text("love "); // Create with jQuery
var txt3 = document.createElement("b"); // Create with DOM
txt3.innerHTML = "jQuery!";
$("img").after(txt1, txt2, txt3); // Insert new elements after
<img>
}

Try it Yourself »

jQuery Exercises
Test Yourself With Exercises
Exercise:
Use a jQuery method to insert the text "YES!" at the end of a <p> element.
$("p"). ("YES!");

Submit Answer »

Start the Exercise

jQuery HTML Reference

You might also like