Udemy
    •  
    •  
    •  
    •  
    •  
    •  
    •  
    •  
Turn what you know into an opportunity and reach millions around the world.
Learn More
Your cart is empty.
Keep shopping
Dynamic HTML - Combination of HTML, JavaScript and CSS
Rating: 4.2 out of 5(57 ratings)
5,726 students

Dynamic HTML - Combination of HTML, JavaScript and CSS

Create Interactive and Animated Websites by using DHTML
Created byDIGIFLAX E-LEARNING
Last updated 9/2021
English
English [Auto],

What you'll learn

  • Visual Effects
  • Dynamic Content
  • Navigation and Styling
  • Numbers, Date, Array, Object, Function, Frame, Form and many more..

Course content

1 section • 15 lectures • 55m total length

  • String5:08

    Explore string handling in JavaScript by measuring string length, accessing characters with charAt, finding positions with indexOf, and building outputs via document.write and concatenation.

  • Numbers3:30

    Learn to validate numeric input with JavaScript in a dynamic HTML context, using isNaN, prompts, and alert messages to handle valid ages and invalid data.

  • Date3:40

    Learn how to use the JavaScript date object to obtain the current system date and extract the month and year, with practical examples and code notes.

  • Array3:45

    Explore arrays by declaring and assigning zero-based elements, managing a five-element array, and outputting elements with a for loop that relies on the array length.

  • Object3:35

    Create a custom object in JavaScript by defining a class with first name and last name properties, instantiating it with new, and displaying its properties in the browser.

  • Function2:48

    learn to detect the user's browser using the navigator.userAgent string, provide a fallback when JavaScript is disabled, and display an alert showing the detected browser.

  • Browser2:48

    Explore protecting the user's browser by detecting the browser via the navigator user agent string and providing JavaScript fallbacks when JavaScript is disabled.

  • Window6:00

    Learn to manage browser windows with the window object by resizing a window and opening a new window using JavaScript, with two buttons demonstrating resize and open window actions.

  • Frame3:33

    Explore how to load multiple pages within a single web page using frames, discuss browser support and cautions, and implement a frame with a specific source and color.

  • Form4:24

    Learn to implement password length check in a form with JavaScript, using a function that reads input length, enforces a minimum of six characters, and shows an alert if invalid.

  • Event4:28

    Explore event handling in dynamic html by distinguishing user-generated and system-generated events, binding events to elements, and subscribing with a subscriber function that alerts on key presses.

  • Navigation3:21

    Explore page navigation with html and JavaScript by using the location object to redirect on button clicks and dropdown selections, while handling browser compatibility with a backup script.

  • Styling3:20

    Apply a global stylesheet to style all elements across your HTML pages, setting paragraph font size to 14pt and color to red.

  • Visual effects2:34

    Explore image rollover effects in dynamic HTML by implementing two JavaScript functions that swap the image source on mouseover and revert on mouseout, using document.getElementById to reference the image.

  • Dynamic content2:32

    Learn to create dynamic content on a web page by clicking a button to generate new button elements on the fly, using document.createElement, setAttribute, and append.

Requirements

  • No experience needed to learn DHTML

Description

Dynamic HTML, or DHTML, is an umbrella term for a collection of technologies used together to create interactive and animated websites by using a combination of a static markup language (such as HTML), a client-side scripting language (such as JavaScript), a presentation definition language (such as CSS), and the Document Object Model.

DHTML allows scripting languages to change variables in a web page's definition language, which in turn affects the look and function of otherwise "static" HTML page content, after the page has been fully loaded and during the viewing process. Thus the dynamic characteristic of DHTML is the way it functions while a page is viewed, not in its ability to generate a unique page with each page load.

By contrast, a dynamic web page is a broader concept, covering any web page generated differently for each user, load occurrence, or specific variable values. This includes pages created by client-side scripting, and ones created by server-side scripting (such as PHP, Python, JSP or ASP .NET) where the web server generates content before sending it to the client.

DHTML is differentiated from Ajax by the fact that a DHTML page is still request/reload-based. With DHTML, there may not be any interaction between the client and server after the page is loaded; all processing happens in JavaScript on the client side. By contrast, an Ajax page uses features of DHTML to initiate a request (or 'subrequest') to the server to perform additional actions. For example, if there are multiple tabs on a page, pure DHTML approach would load the contents of all tabs and then dynamically display only the one that is active, while AJAX could load each tab only when it is really needed.

DHTML allows authors to add effects to their pages that are otherwise difficult to achieve, by changing the Document Object Model (DOM) and page style. The combination of HTML, CSS and JavaScript offers ways to:

  • Animate text and images in their document.

  • Embed a ticker or other dynamic display that automatically refreshes its content with the latest news, stock quotes, or other data.

  • Use a form to capture user input, and then process, verify and respond to that data without having to send data back to the server.

  • Include rollover buttons or drop-down menus.

Who this course is for:

  • Programmers curious to learn Dynamic HTML and Dynamic Content

Report abuse