Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP

Loading…

Removed jQuery as a dependancy #3

Merged
merged 3 commits into from

2 participants

@remy

Works with the same result, but doesn't require a 93k library to achieve the polyfill.

@impressivewebs impressivewebs merged commit 2aa12ea into from
@impressivewebs

Excellent, thanks. Merged. It's barely my polyfill anymore. :)

@remy
@impressivewebs

Yeah, I actually found out about the value property the day I wrote the polyfill. I had never heard about it before then. When I was researching "reversed", I stumbled across that attribute and then the light bulb went on and realized it would be an easy way to mimic the attribute with JS.

Thanks again, I'll credit you in the readme shortly. :)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Commits on Feb 14, 2012
  1. @remy

    removed jQuery dependancy

    remy authored
  2. @remy

    removed jQuery dependancy

    remy authored
  3. @remy

    removed jQuery dependancy

    remy authored
This page is out of date. Refresh to see the latest.
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;
+ }
+ }
+ }
+})();
Something went wrong with that request. Please try again.