include::../rule.adoc[tag=header]

=== Code examples

==== Noncompliant code example

[source,javascript,diff-id=1,diff-type=noncompliant]
----
function JavaScript101() {
  return (
    <>
      <h1>JavaScript Programming Guide</h1>
      <p>An introduction to JavaScript programming and its applications.</p>

      <h2>JavaScript Basics</h2>
      <p>Understanding the basic concepts in JavaScript programming.</p>

      <h3>Variables</h3>
      <p>Explanation of what variables are and how to declare them in JavaScript.</p>

      <h3 aria-hidden>Data Types</h3> // Noncompliant
      <p>Overview of the different data types in JavaScript.</p>

      <h3 /> // Noncompliant
      <p>Understanding how to declare and use functions in JavaScript.</p>
    </>
  );
}
----

==== Compliant solution

[source,javascript,diff-id=1,diff-type=compliant]
----
function JavaScript101() {
  return (
    <>
      <h1>JavaScript Programming Guide</h1>
      <p>An introduction to JavaScript programming and its applications.</p>

      <h2>JavaScript Basics</h2>
      <p>Understanding the basic concepts in JavaScript programming.</p>

      <h3>Variables</h3>
      <p>Explanation of what variables are and how to declare them in JavaScript.</p>

      <h3>Data Types</h3>
      <p>Overview of the different data types in JavaScript.</p>

      <h3>Functions</h3>
      <p>Understanding how to declare and use functions in JavaScript.</p>
    </>
  );
}
----

include::../rule.adoc[tag=footer]