View source for ARIA List using aria-owns

=ARIA based list using aria-owns=
Below are several ul lists converted into a single ARIA-based list using ARIA roles and property without restructuring the code.
==Three ul lists==
<html>
<head>
<body>
  <ul>
    <li>United States</li>
    <li>Canada</li>
    <li>Mexico</li>
  </ul>
  <ul>
    <li>Brazil</li>
    <li>Columbia</li>
    <li>Argentia</li>
  </ul>
  <ul>
    <li>France</li>
    <li>Germany</li>
    <li>Spain</li>
  </ul>
</body>
</html>
===Code snippet===
<syntaxhighlight lang="html4strict">
<ul>
  <li>United States</li>
  <li>Canada</li>
  <li>Mexico</li>
</ul>
<ul>
  <li>Brazil</li>
  <li>Columbia</li>
  <li>Argentia</li>
</ul>
<ul>
  <li>France</li>
  <li>Germany</li>
  <li>Spain</li>
</ul>
</syntaxhighlight>
==Three ul lists consolidated into ARIA list using aria-owns==
<html>
<head>
<body>
  <div role="list" aria-owns="na1 na2 na3 sa1 sa2 sa3 eu1 eu2 eu3" >
    <ul role="presentation">
      <li id="na1" role="listitem">United States</li>
      <li id="na2" role="listitem">Canada</li>
      <li id="na3" role="listitem">Mexico</li>
    </ul>
    <ul role="presentation">
      <li id="sa1" role="listitem">Brazil</li>
      <li id="sa2" role="listitem">Columbia</li>
      <li id="sa3" role="listitem">Argentia</li>
    </ul>
    <ul role="presentation">
      <li id="eu1" role="listitem">France</li>
      <li id="eu2" role="listitem">Germany</li>
      <li id="eu3" role="listitem">Spain</li>
    </ul>
</body>
</html>
===Code snippet===
<syntaxhighlight lang="html4strict">
  <div role="list" aria-owns="na1 na2 na3 sa1 sa2 sa3 eu1 eu2 eu3" >
    <ul role="presentation">
      <li id="na1" role="listitem">United States</li>
      <li id="na2" role="listitem">Canada</li>
      <li id="na3" role="listitem">Mexico</li>
    </ul>
    <ul role="presentation">
      <li id="sa1" role="listitem">Brazil</li>
      <li id="sa2" role="listitem">Columbia</li>
      <li id="sa3" role="listitem">Argentia</li>
    </ul>
    <ul role="presentation">
      <li id="eu1" role="listitem">France</li>
      <li id="eu2" role="listitem">Germany</li>
      <li id="eu3" role="listitem">Spain</li>
    </ul>
</syntaxhighlight>

[[Category:ARIA]]