Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Browse files

Merge pull request #3 from remy/master

Removed jQuery as a dependancy
  • Loading branch information...
commit 2aa12ea78de10b29fc9793dce2e9e56585c22a8a 2 parents 129ae8e + 9e1859d
@impressivewebs authored
Showing with 41 additions and 43 deletions.
  1. +1 −1  README.md
  2. +0 −1  index.html
  3. +40 −41 js/script.js
View
2  README.md
@@ -6,7 +6,7 @@ http://www.impressivewebs.com/reverse-ordered-lists-html5
http://dev.w3.org/html5/spec/Overview.html#the-ol-element
-Just include the script in any page along with the jQuery library and it will automagically make the 'reversed' attribute work on ordered lists (the attribute is only meant for ordered lists).
+Just include the script in any page (at the end or after the DOM has loaded) and it will automagically make the 'reversed' attribute work on ordered lists (the attribute is only meant for ordered lists).
It also takes into consideration the optional 'start' attribute. Fortunately, 'start' has full support in every browser, so no need for a polyfill for that if you're not using 'reversed'.
View
1  index.html
@@ -91,7 +91,6 @@
<li>List item six
</ol>
-<script src="http://code.jquery.com/jquery-1.7.1.js"></script>
<script src="js/script.js"></script>
</body>
</html>
View
81 js/script.js
@@ -1,44 +1,43 @@
-$(function(){
-
- if (!('reversed' in document.createElement('ol'))) {
+if (!('reversed' in document.createElement('ol'))) (function () {
- // run the code on each ordered list with a 'reversed' attribute.
- var myLists = $('ol[reversed]'),
- currCount = null,
- currChildren = null;
+ // run the code on each ordered list with a 'reversed' attribute.
+ var lists = document.getElementsByTagName('ol'),
+ length = lists.length,
+ i,
+ j,
+ childrenLength = 0,
+ child = null
+ currCount = null,
+ currChildren = null;
- myLists.each(function() {
+ for (i = 0; i < length; i++) {
+ child = lists[i];
- // check the existence of the start attribute
- if ($(this).attr('start')) {
-
- // if it exists, convert it to an integer; also ensures even decimal values work
- currCount = parseInt($(this).attr('start'), 10);
-
- // If it wasn't a number, it will return 'NaN'; if so, use the number of list items instead
- if (isNaN(currCount)) {
- currCount = $(this).children().length;
- }
-
- // do this if the start attribute is not present
- // the first number is derived from the number of list items
- } else {
- currCount = $(this).children().length;
- }
-
- // grab all the child list items
- currChildren = $(this).children();
-
- // go through each list item, adding the 'value' attribute plus currCount number
- // then subract one from currCount so we're ready for the next one
- currChildren.each(function() {
-
- $(this).attr('value', currCount);
- currCount = currCount - 1;
-
- });
-
- });
-
- }
-});
+ if (child.getAttribute('reversed') !== null) {
+ currChildren = child.getElementsByTagName('li');
+ childrenLength = currChildren.length;
+ // check the existence of the start attribute
+ if (child.getAttribute('start') !== null) {
+ // if it exists, convert it to an integer; also ensures even decimal values work
+ currCount = +child.start;
+
+ // If it wasn't a number, it will return 'NaN'; if so, use the number of list items instead
+ if (isNaN(currCount)) {
+ currCount = currChildren.length;
+ }
+
+ // do this if the start attribute is not present
+ // the first number is derived from the number of list items
+ } else {
+ currCount = currChildren.length;
+ }
+
+ // go through each list item, adding the 'value' attribute plus currCount number
+ // then subract one from currCount so we're ready for the next one
+ for (j = 0; j < childrenLength; j++) {
+ currChildren[j].setAttribute('value', currCount);
+ currCount -= 1;
+ }
+ }
+ }
+})();
Please sign in to comment.
Something went wrong with that request. Please try again.