Response title
This is preview!
Recreate jQuery
in Getting Started
•
5 years ago
Hello,
I was wondering about the very first bit of jQuery code ever written. I figure it was possibly written inside a script tag as a start.
So I found an article:
http://blog.johnsedlak.com/2013/04/breaking-down-how-jquery-is-built/
And that also comes with a Fiddle:
http://jsfiddle.net/jsedlak/s5bC4/
But the problem is with the above Fiddle if you remove the jQuery link then $ becomes undefined. So the question is how do you modify the Fiddle so that $ becomes ( you can't add the link back ) defined and then build a method so that .addClass2 functions with this minimal script code. When I say remove the jQuery link I mean this link:
<script src="http://code.jquery.com/jquery-2.0.3.js" type="text/javascript"></script>
Meaning if you have:
<p>blah</p>
<p>blah2</p>
<p>blah3</p>
and upon executing $('p').addClass2('test');
does update the DOM and looks like:
<p class="test" >blah</p>
<p class="test">blah2</p>
<p class="test">blah3</p>
The specific code I am working from is this to build upon or rewrite:
Thanks,
Jim
I was wondering about the very first bit of jQuery code ever written. I figure it was possibly written inside a script tag as a start.
So I found an article:
http://blog.johnsedlak.com/2013/04/breaking-down-how-jquery-is-built/
And that also comes with a Fiddle:
http://jsfiddle.net/jsedlak/s5bC4/
But the problem is with the above Fiddle if you remove the jQuery link then $ becomes undefined. So the question is how do you modify the Fiddle so that $ becomes ( you can't add the link back ) defined and then build a method so that .addClass2 functions with this minimal script code. When I say remove the jQuery link I mean this link:
<script src="http://code.jquery.com/jquery-2.0.3.js" type="text/javascript"></script>
Meaning if you have:
<p>blah</p>
<p>blah2</p>
<p>blah3</p>
and upon executing $('p').addClass2('test');
does update the DOM and looks like:
<p class="test" >blah</p>
<p class="test">blah2</p>
<p class="test">blah3</p>
The specific code I am working from is this to build upon or rewrite:
- <!DOCTYPE html>
- <html lang="en">
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
- <title>HTML</title>
- <meta name="description" content="">
- <meta name="author" content="Jim">
- <style type='text/css'>
- </style>
- </head>
- <body>
- <div id='log'>
- </div>
- <script type="text/javascript">
- (function (window, undefined) {
- var
- version = new Version(2, 0, 0, 0),
- js = function (selector) {
- return new js.fn.init(selector);
- };
- js.fn = js.prototype = {
- version: version,
- init: function (selector) {
- this.$element = $(selector);
- return this;
- }
- };
- js.fn.init.prototype = js.fn;
- window.js = js;
- function Version(major, minor, build, revision) {
- this.major = major;
- this.minor = minor;
- this.build = build;
- this.revision = revision;
- this.toString = function () {
- return this.major.toString() + '.' + this.minor.toString() + '.' + this.build.toString() + '.' + this.revision.toString();
- };
- }
- })(window);
- //The author is showing how you can get version info, I am looking for addClass2
- //Furthermore his version info does not work unless you define the jQuery library.
- js('#Log').$element.append(js().version.toString() + '\r\n');
- </script>
- </body>
- </html>
$.fn.addClass2 = function(){//Use this to build addClass2var currentjQueryObject = this; //work with currentObject return this;//you can include this if you would like to support chaining };
Thanks,
Jim
1
.