Photo:1
Photo:2
Photo:3
Photo:4
Photo:1 Photo:2 Photo:3 Photo:4 |
| Uses | |
| 2>
DHTML allows authors to add effects to their pages that are otherwise difficult to achieve. For example, DHTML allows the page author to:
Animate text and images in their document, independently moving each element from any starting point to any ending point, following a predetermined path or one chosen by the user.
Embed a ticker that automatically refreshes its content with the latest news, stock quotes, or other data.
Use a form to capture user input, and then process and respond to that data without having to send data back to the server.
Include rollover buttons or drop-down menus.
A less common use is to create browser-based action games. During the late 1990s and early 2000s, a number of games were created using DHTML[citation needed], but differences between browsers made this difficult: many techniques had to be implemented in code to enable the games to work on multiple platforms. Recently browsers have been converging towards the web standards, which has made the design of DHTML games more viable. Those games can be played on all major browsers and they can also be ported to Widgets for Mac OS X and Gadgets for Windows Vista, which are based on DHTML code.
The term "DHTML" has fallen out of use in recent years as it was associated with practices and conventions that tended to not work well between various web browsers. DHTML may now be referred to as unobtrusive JavaScript coding (DOM Scripting), in an effort to place an emphasis on agreed-upon best practices while allowing similar effects in an accessible, standards-compliant way.
Basic DHTML support was introduced with Internet Explorer 4.0, although there was a basic dynamic system with Netscape Navigator 4.0. When it originally became widespread, varying degrees of support among web browsers for the technologies involved made DHTML-style techniques difficult to develop and debug. Development became easier when Internet Explorer 5.0+, Mozilla Firefox 2.0+, and Opera 7.0+ adopted a shared DOM.
More recently, JavaScript libraries such as jQuery have abstracted away much of the day-to-day difficulties in cross-browser DOM manipulation.
[edit] Tags:Html,Web Browsers,Javascript,Mac Os X,Unobtrusive Javascript,Dom Scripting,Internet Explorer 4.0,Debug,Internet Explorer 5.0+,Mozilla Firefox,Opera,Javascript Libraries,Jquery,Edit,Libraries,Read, | |
| Structure of a web page | |
| 2>
See also: DOM events
Typically a web page using DHTML is set up the following way:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>DHTML example</title>
<script type="text/javascript">
function init() {
myObj = document.getElementById("navigation");
// .... more code
}
window.onload=init;
</script>
</head>
<body>
<div id="navigation"></div>
<pre>
Often the code is stored in an external file; this is done
by linking the file that contains the JavaScript.
This is helpful when several pages use the same script:
</pre>
<script type="text/javascript" src="myjavascript.js"></script>
</body>
</html>
In the above code, the blue code represents the DOCUMENT TYPE declaration, which specifies which version of markup code is used to create the website. The red code shows browser detection Javascript, which enables web pages to adjust to browser application standards and requirements.
[edit] Tags:Xhtml,W3c,1.1,Help, | |
| Example: Displaying an additional block of text | |
| 2>
The following code illustrates an often-used function. An additional part of a web page will only be displayed if the user requests it.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title>Test</title>
<style type="text/css">
h2 {background-color: green; width: 100%}
a {font-size: larger; background-color: red;}
a:hover {background-color: gold}
#example1 {display: none; margin: 3%; padding: 4%; background-color: limegreen}
</style>
<script type="text/javascript">
function changeDisplayState (id) {
d=document.getElementById("showhide");
e=document.getElementById(id);
if (e.style.display == 'none' || e.style.display == "") {
e.style.display = 'block';
d.innerHTML = 'Hide example..............';
} else {
e.style.display = 'none';
d.innerHTML = 'Show example';
}
}
</script>
</head>
<body>
<h2>How to use a DOM function</h2>
<div><a id="showhide" href="javascript:changeDisplayState('example1')">Show example</a></div>
<div id="example1">
This is the example.
(Additional information, which is only displayed on request)...
</div>
<div>The general text continues...</div>
</body>
</html>
[edit] Tags:Css, | |
| References | |
| 2>
^ http://www.w3.org/DOM/#why
^ http://www.w3.org/Style/#dynamic
http://sourceforge.net/projects/jscalendar/
[edit] Tags: | |
| External links | |
| 2>
QuirksMode, a comprehensive site with test examples and instructions on how to write DHTML code which runs on several browsers.
Introductory DHTML Tutorial for those taking their first steps in DHTML.
HTML & DHTML Reference on MSDN
v
d
e
ECMAScript
Dialects
ActionScript · Caja · JavaScript (engines) · JScript · JScript .NET · Objective-J · QtScript · WMLScript
Engines
(comparison)
Carakan · Futhark · InScript · JavaScriptCore (SquirrelFish) · JScript · KJS · Linear B · Narcissus · QtScript · Rhino · SpiderMonkey (TraceMonkey, JägerMonkey) · Tamarin · V8 · Chakra
Frameworks,
libraries
JavaScript
(comparison)
Client-side
(list, Ajax frameworks)
Ample SDK · CougarXML · Dojo · Echo · Ext JS · Google Web Toolkit · jQuery · Lively Kernel · midori · MochiKit · MooTools · OpenLink AJAX · Prototype · Pyjamas · qooxdoo · Rialto · Rico · script.aculo.us · SmartClient · SproutCore · Spry · YUI Library
Server-side
(comparison)
AppJet · Jaxer · Node.js
Libraries
(list)
SWFObject · SWFAddress
ActionScript
PureMVC
Multiple
implementations
Cappuccino (JavaScript, Objective-J)
People
Brendan Eich · Douglas Crockford · John Resig
Other
DHTML · Ecma International · JSAN · JSDoc · JSLint · JSON · JSSS · Sputnik · SunSpider · CommonJS
Retrieved from "http://en.wikipedia.org/w/index.php?title=Dynamic_HTML&oldid=468599227"
Categories: HTMLHidden categories: Wikipedia articles needing style editing from December 2008All articles needing style editingAll articles with unsourced statementsArticles with unsourced statements from October 2008
Personal tools
Log in / create account
Namespaces
Article
Talk
Variants
Views
Read
Edit
View history
Actions
Search
Navigation
Main page
Contents
Featured content
Current events
Random article
Donate to Wikipedia
Interaction
Help
About Wikipedia
Community portal
Recent changes
Contact Wikipedia
Toolbox
What links here
Related changes
Upload file
Special pages
Permanent link
Cite this page
Print/export
Create a bookDownload as PDFPrintable version
Languages
Български
Česky
Deutsch
Español
Euskara
فارسی
Français
한국어
हिन्दी
Bahasa Indonesia
Italiano
עברית
Nederlands
日本語
ភាសាខ្មែរ
Polski
Português
Română
Русский
Slovenčina
Suomi
Svenska
Türkçe
Українська
Tiếng Việt
中文
This page was last modified on 30 December 2011 at 14:07.
Text is available under the Creative Commons Attribution-ShareAlike License;
additional terms may apply.
See Terms of use for details.
Wikipedia® is a registered trademark of the Wikimedia Foundation, Inc., a non-profit organization.Contact us
Privacy policy
About Wikipedia
Disclaimers
Mobile view
if ( window.isMSIE55 ) fixalpha();
if ( window.mediaWiki ) {
mw.loader.load(["mediawiki.user", "mediawiki.util", "mediawiki.page.ready", "mediawiki.legacy.wikibits", "mediawiki.legacy.ajax", "mediawiki.legacy.mwsuggest", "ext.gadget.wmfFR2011Style", "ext.vector.collapsibleNav", "ext.vector.collapsibleTabs", "ext.vector.editWarning", "ext.vector.simpleSearch", "ext.UserBuckets", "ext.articleFeedback.startup", "ext.articleFeedbackv5.startup", "ext.markAsHelpful"]);
}
if ( window.mediaWiki ) {
mw.user.options.set({"ccmeonemails":0,"cols":80,"date":"default","diffonly":0,"disablemail":0,"disablesuggest":0,"editfont":"default","editondblclick":0,"editsection":1,"editsectiononrightclick":0,"enotifminoredits":0,"enotifrevealaddr":0,"enotifusertalkpages":1,"enotifwatchlistpages":0,"extendwatchlist":0,"externaldiff":0,"externaleditor":0,"fancysig":0,"forceeditsummary":0,"gender":"unknown","hideminor":0,"hidepatrolled":0,"highlightbroken":1,"imagesize":2,"justify":0,"math":1,"minordefault":0,"newpageshidepatrolled":0,"nocache":0,"noconvertlink":0,"norollbackdiff":0,"numberheadings":0,"previewonfirst":0,"previewontop":1,"quickbar":5,"rcdays":7,"rclimit":50,"rememberpassword":0,"rows":25,"searchlimit":20,"showhiddencats":false,"showjumplinks":1,"shownumberswatching":1,"showtoc":1,"showtoolbar":1,"skin":"vector","stubthreshold":0,"thumbsize":4,"underline":2,"uselivepreview":0,"usenewrc":0,"watchcreations":1,"watchdefault":0,"watchdeletion":0,"watchlistdays":3,"watchlisthideanons":0,
"watchlisthidebots":0,"watchlisthideliu":0,"watchlisthideminor":0,"watchlisthideown":0,"watchlisthidepatrolled":0,"watchmoves":0,"wllimit":250,"flaggedrevssimpleui":1,"flaggedrevsstable":0,"flaggedrevseditdiffs":true,"flaggedrevsviewdiffs":false,"vector-simplesearch":1,"useeditwarning":1,"vector-collapsiblenav":1,"usebetatoolbar":1,"usebetatoolbar-cgd":1,"wikilove-enabled":1,"variant":"en","language":"en","searchNs0":true,"searchNs1":false,"searchNs2":false,"searchNs3":false,"searchNs4":false,"searchNs5":false,"searchNs6":false,"searchNs7":false,"searchNs8":false,"searchNs9":false,"searchNs10":false,"searchNs11":false,"searchNs12":false,"searchNs13":false,"searchNs14":false,"searchNs15":false,"searchNs100":false,"searchNs101":false,"searchNs108":false,"searchNs109":false,"gadget-wmfFR2011Style":1});;mw.user.tokens.set({"editToken":"+\\","watchToken":false});;mw.loader.state({"user.options":"ready","user.tokens":"ready"});
/* cache key: enwiki:resourceloader:filter:minify-js:4:b41a86ec4e0fe8329bc3ce917e792339 */
}
Tags:Php,Ecmascript,Wmlscript,Engines,Comparison,Spidermonkey,Chakra,Client-side,Yui Library,Server-side,Node.js,List,Swfaddress,Puremvc,Cappuccino,Objective-j,Commonjs,Categories,Wikipedia Articles Needing Style Editing From December 2008,All Articles Needing Style Editing,All Articles With Unsourced Statements,Articles With Unsourced Statements From October 2008, | |
zote monety |