CINXE.COM

DTD Elements

<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="keywords" content="dtd elements, cdata sections, duplicate element names, syntax, programming, how to, xml tutorial, extensible markup language, learn xml"> <meta name="Description" content="Learn how to define elements in your DTD with this free XML tutorial."> <link rel="canonical" href="https://www.quackit.com/xml/tutorial/dtd_elements.cfm"> <title>DTD Elements</title> <script src="//ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> <link rel="shortcut icon" href="/pix/favicon96.png"> <link rel="apple-touch-icon" href="/pix/apple-touch-icon.png"> <link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link href="https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,400;0,700;1,400&display=swap" rel="stylesheet"> <link href="/common/css/master.45.min.css" rel="stylesheet"> <script async src="https://cdn.fuseplatform.net/publift/tags/2/3499/fuse.js"></script> <!-- Global site tag (gtag.js) - Google Analytics --> <script async src="https://www.googletagmanager.com/gtag/js?id=G-Q3H025ZKLN"></script> <script> window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'G-Q3H025ZKLN'); </script> </head> <body> <header class="site-header"> <div class="site-header-base"> <div class="site-logo"> <a title="Quackit Homepage" target="_top" href="/"><img src="/pix/quackit_logo_watermark.png" width="87" height="33" alt="Quackit Logo"></a> </div> <button id="site-nav-toggler" class="site-nav-toggler" aria-expanded="false" aria-controls="site-nav"> <span class="sr-only">Toggle navigation</span> &#9776; </button> </div> <nav id="site-nav" class="site-nav"> <div class="site-links"> <ul> <li><a href="/"><i class="fa fa-home"></i> <span class="sr-only">Home</span></a></li> <li><a href="/html/">HTML</a></li> <li><a href="/css/">CSS</a></li> <li><a href="/scripting/">Scripting</a></li> <li><a href="/database/">Database</a></li> </ul> </div> <div class="site-search-top"> <form action="/search/" id="cse-search-box-bottom" class="site-search"> <div> <input type="hidden" name="cx" value="partner-pub-6331358926293806:98x0fk-bbgi"> <input type="hidden" name="cof" value="FORID:10"> <input type="hidden" name="ie" value="ISO-8859-1"> <input type="text" name="q" size="20" class="site-search-input"> <button type="submit" name="sa" class="site-search-button"><i class="fa fa-search"></i></button> </div> </form> </div> </nav> </header> <div class="main"> <article class="content"> <h1 class="page-title">DTD Elements</h1> <div class="ad ad-top"> <!-- GAM 71161633/QCKIT_quackit/article_header --> <div data-fuse="23059883623"></div> </div> <ul class="pager"> <li><a href="/xml/tutorial/dtd_fpi.cfm"><i class="fa fa-long-arrow-left" aria-hidden="true"></i> DTD FPI</a></li> <li><a href="/xml/tutorial/dtd_element_operators.cfm">Element Operators <i class="fa fa-long-arrow-right" aria-hidden="true"></i></a></li> </ul> <p class="lead">Creating a DTD is quite straight forward. It's really just a matter of defining your elements, attributes, and/or entities. Over the next few lessons, I'll explain how to define your <a href="/xml/tutorial/xml_elements.cfm">elements</a>, <a href="/xml/tutorial/xml_attributes.cfm">attributes</a>, and <a href="/xml/tutorial/xml_entities.cfm">entities</a>.</p> <p>In this lesson, we'll look at the syntax for defining your XML elements.</p> <p>To define an element in your DTD, you use the <code>&lt;!ELEMENT&gt;</code> declaration. The actual contents of your <code>&lt;!ELEMENT&gt;</code> declaration will depend on the syntax rules you need to apply to your element.</p> <div class="ad"> <!-- GAM 71161633/QCKIT_quackit/article_incontent_1 --> <div data-fuse="23059883629"></div> </div> <h2>Basic Syntax</h2> <p>The <code>&lt;!ELEMENT&gt;</code> declaration has the following syntax:</p> <script src="/common/js/codemirror/lib/codemirror.js"></script> <script src="/common/js/codemirror/mode/htmlmixed/htmlmixed.js"></script> <script src="/common/js/codemirror/mode/css/css.js"></script> <script src="/common/js/codemirror/mode/javascript/javascript.js"></script> <script src="/common/js/codemirror/mode/xml/xml.js"></script> <div class="code-only"> <textarea id="example1" autocomplete="off" spellcheck="false">&lt;&#x21;ELEMENT element_name content_model&gt;</textarea> </div> <script> var exampleCode1 = CodeMirror.fromTextArea(document.getElementById("example1"), { mode: "htmlmixed", tabMode: "indent", styleActiveLine: false, lineNumbers: false, lineWrapping: true, theme: "q-dark" }); </script> <p>Here, <code>element_name</code> is the name of the element you're defining. The <code>content model</code> could indicate a specific rule, data or another element. </p> <ul> <li>If it specifies a rule, it will be set to either <code>ANY</code> or <code>EMPTY</code>.</li> <li>If specifies data or another element, the data type/element name needs to be surrounded by brackets (i.e. <code>(tutorial)</code> or <code>(#PCDATA)</code>).</li> </ul> <p>The following examples show you how to use this syntax for defining your elements.</p> <h2>Plain Text</h2> <p>If an element should contain plain text, you define the element using <dfn>#PCDATA</dfn>. PCDATA stands for <dfn>Parsed Character Data</dfn> and is the way you specify non-markup text in your DTDs.</p> <p>Using this example - <code>&lt;name&gt;XML Tutorial&lt;/name&gt;</code> &mdash; the <code>XML Tutorial</code> part is the PCDATA. The other part consists of markup.</p> <p>Syntax:</p> <script src="/common/js/codemirror/mode/htmlmixed/htmlmixed.js"></script> <div class="code-only"> <textarea id="example2" autocomplete="off" spellcheck="false">&lt;&#x21;ELEMENT element_name &#x28;&#x23;PCDATA&#x29;&gt;</textarea> </div> <script> var exampleCode2 = CodeMirror.fromTextArea(document.getElementById("example2"), { mode: "htmlmixed", tabMode: "indent", styleActiveLine: false, lineNumbers: false, lineWrapping: true, theme: "q-dark" }); </script> <p>Example:</p> <div class="code-only"> <textarea id="example3" autocomplete="off" spellcheck="false">&lt;&#x21;ELEMENT name &#x28;&#x23;PCDATA&#x29;&gt;</textarea> </div> <script> var exampleCode3 = CodeMirror.fromTextArea(document.getElementById("example3"), { mode: "htmlmixed", tabMode: "indent", styleActiveLine: false, lineNumbers: false, lineWrapping: true, theme: "q-dark" }); </script> <p>The above line in your DTD allows the <code>name</code> element to contain non-markup data in your <a href="/xml/tutorial/xml_documents.cfm">XML document</a>:</p> <div class="code-only"> <textarea id="example4" autocomplete="off" spellcheck="false">&lt;name&gt;XML Tutorial&lt;&#x2f;name&gt;</textarea> </div> <script> var exampleCode4 = CodeMirror.fromTextArea(document.getElementById("example4"), { mode: "htmlmixed", tabMode: "indent", styleActiveLine: false, lineNumbers: false, lineWrapping: true, theme: "q-dark" }); </script> <h2>Unrestricted Elements</h2> <p>If it doesn't matter what your element contains, you can create an element using the content_model of <code>ANY</code>. Note that doing this removes all syntax checking, so you should avoid using this if possible. You're better off defining a specific content model.</p> <p>Syntax:</p> <div class="code-only"> <textarea id="example5" autocomplete="off" spellcheck="false">&lt;&#x21;ELEMENT element_name ANY&gt;</textarea> </div> <script> var exampleCode5 = CodeMirror.fromTextArea(document.getElementById("example5"), { mode: "htmlmixed", tabMode: "indent", styleActiveLine: false, lineNumbers: false, lineWrapping: true, theme: "q-dark" }); </script> <p>Example:</p> <div class="code-only"> <textarea id="example6" autocomplete="off" spellcheck="false">&lt;&#x21;ELEMENT tutorials ANY&gt;</textarea> </div> <script> var exampleCode6 = CodeMirror.fromTextArea(document.getElementById("example6"), { mode: "htmlmixed", tabMode: "indent", styleActiveLine: false, lineNumbers: false, lineWrapping: true, theme: "q-dark" }); </script> <h2>Empty Elements</h2> <p>You might remember that an empty element is one without a closing tag. For example, in <a href="/xhtml/xhtml_tutorial.cfm">XHTML</a>, the <code>&lt;br /&gt;</code> and <code>&lt;img /&gt;</code> tags are empty elements. Here's how you define an empty element:</p> <p>Syntax:</p> <div class="code-only"> <textarea id="example7" autocomplete="off" spellcheck="false">&lt;&#x21;ELEMENT element_name EMPTY&gt;</textarea> </div> <script> var exampleCode7 = CodeMirror.fromTextArea(document.getElementById("example7"), { mode: "htmlmixed", tabMode: "indent", styleActiveLine: false, lineNumbers: false, lineWrapping: true, theme: "q-dark" }); </script> <p>Example:</p> <div class="code-only"> <textarea id="example8" autocomplete="off" spellcheck="false">&lt;&#x21;ELEMENT header EMPTY&gt;</textarea> </div> <script> var exampleCode8 = CodeMirror.fromTextArea(document.getElementById("example8"), { mode: "htmlmixed", tabMode: "indent", styleActiveLine: false, lineNumbers: false, lineWrapping: true, theme: "q-dark" }); </script> <p>The above line in your DTD defines the following empty element for your XML document:</p> <div class="code-only"> <textarea id="example9" autocomplete="off" spellcheck="false">&lt;header &#x2f;&gt;</textarea> </div> <script> var exampleCode9 = CodeMirror.fromTextArea(document.getElementById("example9"), { mode: "htmlmixed", tabMode: "indent", styleActiveLine: false, lineNumbers: false, lineWrapping: true, theme: "q-dark" }); </script> <h2>Child Elements</h2> <p>You can specify that an element must contain another element, by providing the name of the element it must contain. Here's how you do that:</p> <p>Syntax:</p> <div class="code-only"> <textarea id="example10" autocomplete="off" spellcheck="false">&lt;&#x21;ELEMENT element_name &#x28;child_element_name&#x29;&gt;</textarea> </div> <script> var exampleCode10 = CodeMirror.fromTextArea(document.getElementById("example10"), { mode: "htmlmixed", tabMode: "indent", styleActiveLine: false, lineNumbers: false, lineWrapping: true, theme: "q-dark" }); </script> <p>Example:</p> <div class="code-only"> <textarea id="example11" autocomplete="off" spellcheck="false">&lt;&#x21;ELEMENT tutorials &#x28;tutorial&#x29;&gt;</textarea> </div> <script> var exampleCode11 = CodeMirror.fromTextArea(document.getElementById("example11"), { mode: "htmlmixed", tabMode: "indent", styleActiveLine: false, lineNumbers: false, lineWrapping: true, theme: "q-dark" }); </script> <p>The above line in your DTD allows the <code>tutorials</code> element to contain one instance of the <code>tutorial</code> element in your XML document:</p> <div class="code-only"> <textarea id="example12" autocomplete="off" spellcheck="false">&lt;tutorials&gt;&#xd;&#xa; &lt;tutorial&gt;&lt;&#x2f;tutorial&gt;&#xd;&#xa;&lt;&#x2f;tutorials&gt;</textarea> </div> <script> var exampleCode12 = CodeMirror.fromTextArea(document.getElementById("example12"), { mode: "htmlmixed", tabMode: "indent", styleActiveLine: false, lineNumbers: false, lineWrapping: true, theme: "q-dark" }); </script> <h2>Multiple Child Elements (Sequences)</h2> <p>You can also provide a comma separated list of elements if it needs to contain more than one element. This is referred to as a sequence. The XML document must contain the tags in the same order that they're specified in the sequence.</p> <p>Syntax:</p> <div class="code-only"> <textarea id="example13" autocomplete="off" spellcheck="false">&lt;&#x21;ELEMENT element_name &#x28;child_element_name, child_element_name,...&#x29;&gt;</textarea> </div> <script> var exampleCode13 = CodeMirror.fromTextArea(document.getElementById("example13"), { mode: "htmlmixed", tabMode: "indent", styleActiveLine: false, lineNumbers: false, lineWrapping: true, theme: "q-dark" }); </script> <p>Example:</p> <div class="code-only"> <textarea id="example14" autocomplete="off" spellcheck="false">&lt;&#x21;ELEMENT tutorial &#x28;name, url&#x29;&gt;</textarea> </div> <script> var exampleCode14 = CodeMirror.fromTextArea(document.getElementById("example14"), { mode: "htmlmixed", tabMode: "indent", styleActiveLine: false, lineNumbers: false, lineWrapping: true, theme: "q-dark" }); </script> <p>The above line in your DTD allows the <code>tutorial</code> element to contain one instance of the <code>name</code> element and one instance of the <code>url</code> element in your XML document:</p> <div class="code-only"> <textarea id="example15" autocomplete="off" spellcheck="false">&lt;tutorials&gt;&#xd;&#xa; &lt;tutorial&gt;&#xd;&#xa; &lt;name&gt;&lt;&#x2f;name&gt;&#xd;&#xa; &lt;url&gt;&lt;&#x2f;url&gt;&#xd;&#xa; &lt;&#x2f;tutorial&gt;&#xd;&#xa;&lt;&#x2f;tutorials&gt;</textarea> </div> <script> var exampleCode15 = CodeMirror.fromTextArea(document.getElementById("example15"), { mode: "htmlmixed", tabMode: "indent", styleActiveLine: false, lineNumbers: false, lineWrapping: true, theme: "q-dark" }); </script> <ul class="pager"> <li><a href="/xml/tutorial/dtd_fpi.cfm"><i class="fa fa-long-arrow-left" aria-hidden="true"></i> DTD FPI</a></li> <li><a href="/xml/tutorial/dtd_element_operators.cfm">Element Operators <i class="fa fa-long-arrow-right" aria-hidden="true"></i></a></li> </ul> </article> <div class="sidebar"> <nav> <ul> <li> <h3><a href="/xml/tutorial/" title="">XML Tutorial</a></h3> <ul> <li><a href="/xml/tutorial/about_xml.cfm" title="">About XML</a></li> <li><a href="/xml/tutorial/xml_viewers.cfm" title="">XML Viewers</a></li> <li><a href="/xml/tutorial/xml_editors.cfm" title="">XML Editors</a></li> <li><a href="/xml/tutorial/xml_documents.cfm" title="">XML Documents</a></li> <li><a href="/xml/tutorial/xml_syntax.cfm" title="">XML Syntax</a></li> <li><a href="/xml/tutorial/xml_elements.cfm" title="">XML Elements</a></li> <li><a href="/xml/tutorial/xml_attributes.cfm" title="">XML Attributes</a></li> <li><a href="/xml/tutorial/xml_css.cfm" title="">XML with CSS</a></li> <li><a href="/xml/tutorial/xml_xsl.cfm" title="">XML with XSL</a></li> <li><a href="/xml/tutorial/xml_namespace.cfm" title="">XML Namespace</a></li> <li><a href="/xml/tutorial/xml_local_namespace.cfm" title="">XML Local Namespace</a></li> <li><a href="/xml/tutorial/xml_default_namespace.cfm" title="">XML Default Namespace</a></li> <li><a href="/xml/tutorial/xml_entities.cfm" title="">XML Entities</a></li> <li><a href="/xml/tutorial/xml_creating_entities.cfm" title="">XML Creating Entities</a></li> <li><a href="/xml/tutorial/xml_cdata.cfm" title="">XML CDATA</a></li> </ul> </li> <li> <h3 class="heading-only">DTD</h3> <ul> <li><a href="/xml/tutorial/dtd_introduction.cfm" title="">DTD Introduction</a></li> <li><a href="/xml/tutorial/dtd_doctype.cfm" title="">DTD DOCTYPE</a></li> <li><a href="/xml/tutorial/dtd_internal_dtd.cfm" title="">DTD Internal</a></li> <li><a href="/xml/tutorial/dtd_external_dtd.cfm" title="">DTD External</a></li> <li><a href="/xml/tutorial/dtd_combined_dtd.cfm" title="">DTD Combined</a></li> <li><a href="/xml/tutorial/dtd_fpi.cfm" title="">DTD FPI</a></li> <li><a href="/xml/tutorial/dtd_elements.cfm" title="">DTD Elements</a></li> <li><a href="/xml/tutorial/dtd_element_operators.cfm" title="">DTD Element Operators</a></li> <li><a href="/xml/tutorial/dtd_attributes.cfm" title="">DTD Attributes</a></li> <li><a href="/xml/tutorial/dtd_attribute_default_values.cfm" title="">DTD Attribute Default Values</a></li> <li><a href="/xml/tutorial/dtd_attribute_types.cfm" title="">DTD Attribute Types</a></li> <li><a href="/xml/tutorial/dtd_general_entities.cfm" title="">DTD General Entities</a></li> <li><a href="/xml/tutorial/dtd_parameter_entities.cfm" title="">DTD Parameter Entities</a></li> <li><a href="/xml/tutorial/dtd_embedded_images.cfm" title="">DTD Embedded Images</a></li> </ul> </li> <li> <h3 class="heading-only">XSLT</h3> <ul> <li><a href="/xml/tutorial/xslt_introduction.cfm" title="">XSLT Introduction</a></li> <li><a href="/xml/tutorial/xslt_example.cfm" title="">XSLT Example</a></li> <li><a href="/xml/tutorial/xslt_syntax.cfm" title="">XSLT Syntax</a></li> <li><a href="/xml/tutorial/xslt_template.cfm" title="">XSLT &lt;template&gt;</a></li> <li><a href="/xml/tutorial/xslt_apply-templates.cfm" title="">XSLT &lt;apply-templates&gt;</a></li> <li><a href="/xml/tutorial/xslt_value-of.cfm" title="">XSLT &lt;value-of&gt;</a></li> <li><a href="/xml/tutorial/xslt_for-each.cfm" title="">XSLT &lt;for-each&gt;</a></li> <li><a href="/xml/tutorial/xslt_sort.cfm" title="">XSLT &lt;sort&gt;</a></li> <li><a href="/xml/tutorial/xslt_if.cfm" title="">XSLT &lt;if&gt;</a></li> <li><a href="/xml/tutorial/xslt_choose.cfm" title="">XSLT &lt;choose&gt;</a></li> </ul> </li> <li> <h3 class="heading-only">XPath</h3> <ul> <li><a href="/xml/tutorial/xpath_introduction.cfm" title="">XPath Introduction</a></li> <li><a href="/xml/tutorial/xpath_location_path.cfm" title="">XPath Location Path</a></li> <li><a href="/xml/tutorial/xpath_location_path_absolute.cfm" title="">XPath Location Path - Absolute</a></li> <li><a href="/xml/tutorial/xpath_location_path_relative.cfm" title="">XPath Location Path - Relative</a></li> <li><a href="/xml/tutorial/xpath_attributes.cfm" title="">XPath Attributes</a></li> <li><a href="/xml/tutorial/xpath_axis.cfm" title="">XPath Axis</a></li> <li><a href="/xml/tutorial/xpath_node_test.cfm" title="">XPath Node Test</a></li> <li><a href="/xml/tutorial/xpath_predicate.cfm" title="">XPath Predicate</a></li> <li><a href="/xml/tutorial/xpath_node_set.cfm" title="">XPath Node Set</a></li> <li><a href="/xml/tutorial/xpath_comparison_operators.cfm" title="">XPath Comparison Operators</a></li> <li><a href="/xml/tutorial/xpath_boolean_operators.cfm" title="">XPath Boolean Operators</a></li> <li><a href="/xml/tutorial/xpath_number_operators.cfm" title="">XPath Number Operators</a></li> <li><a href="/xml/tutorial/xpath_string_functions.cfm" title="">XPath String Functions</a></li> <li><a href="/xml/tutorial/xml_tutorial_summary.cfm" title="">Tutorial Summary</a></li> </ul> </li> </ul> </nav> <div class="ad ad-left"> <!-- GAM 71161633/QCKIT_quackit/article_vrec_2 --> <div data-fuse="23059511712"></div> </div> </div> <div class="ads"> <div class="ad ad-right"> <!-- GAM 71161633/QCKIT_quackit/article_vrec_1 --> <div data-fuse="23059883626"></div> </div> </div> </div> <div class="searchbox-bottom"> <form action="/search/" id="cse-search-box-bottom" class="site-search"> <div> <input type="hidden" name="cx" value="partner-pub-6331358926293806:npmuvy-i8kk"> <input type="hidden" name="cof" value="FORID:10"> <input type="hidden" name="ie" value="ISO-8859-1"> <input type="text" name="q" size="30" class="site-search-input"> <button type="submit" name="sa" class="site-search-button"><i class="fa fa-search"></i></button> </div> </form> <script src="//cse.google.com/cse/brand?form=cse-search-box-bottom&amp;lang=en"></script> </div> <footer> <p class="about"><a href="/"><i class="fa fa-home"></i> Home</a> | <a href="/about.cfm" rel="nofollow">About</a> | <a href="/contact.cfm" rel="nofollow">Contact</a> | <a href="/terms_of_use.cfm" rel="nofollow">Terms&nbsp;of&nbsp;Use</a> | <a href="/privacy_policy.cfm" rel="nofollow">Privacy&nbsp;Policy</a></p> <p>&#169; Copyright 2000 - 2025 Quackit.com &nbsp;</p> </footer> <script src="/common/js/spectrum/spectrum.js"></script> <script src="/common/js/lightbox2-master/dist/js/lightbox.min.js" charset="utf-8"></script> <script> $(document).ready(function(){ $( "#site-nav-toggler" ).click(function() { $( "#site-nav" ).toggle( "slow" ); }); }); </script> <script> $(function(){var a=window.location.href;$(".sidebar nav a").each(function(){a==this.href&&$(this).closest("li").addClass("selected")})}); </script> </body> </html>

Pages: 1 2 3 4 5 6 7 8 9 10