Post on 15-Jun-2015
CourseSites jQuery plug-in
Context
• Replace specific string(s) on a page that is part of href with something else
CourseSites
• Instructor homepage (ie. https://wayank12teacher2.coursesites.com)– List of courses• Course101 (https://
wayank12teacher2.coursesites.com/s/_course101)• Course102
(https://wayank12teacher2.coursesites.com/s/_course102)
• Goal replace wayank12teacher2 with www
Firebug…locate the element
Firebug…locate the element (2)
Element of interest
• <li class="course-navigation-course"><a class="highlight" href="https://wayank12teacher2.coursesites-stage.com/s/_wayank12changestructure101">wayank12changestructure101»</a></li>
Find those elements
• jQuery('li.course-navigation-course').find('a[href]')
• Results:• [<a class= "highlight" href= "https: / /
wayank12teacher2.coursesites-stage.com/ s/ _wayank12changestructure101"> wayank12changestructure101» </a>
• , <a class= "highlight" href= "https: / / wayank12teacher2.coursesites-stage.com/ s/ _wayank12nov04test101"> wayank12nov04test101» </a>
• ]
Search and Replace ( Use Firebug if you have to)
• location.host• Result "wayank12teacher2.coursesites-
stage.com"
• var b='https://' + location.host.replace(location.host.split('.')[0],'www')
The plug-in
• jQuery.fn.convertUsertoWWW = function() { return this.each( function() { – var c=$(this).attr('href'); – var b='https://' +
location.host.replace(location.host.split('.')[0],'www')+c;
– $(this).attr('href',b); – }
• );
To execute
• jQuery('li.course-navigation-course').find('a[href]').convertUsertoWWW();
Final script
• jQuery(document).ready(function() { jQuery.fn.convertUsertoWWW = function() { return this.each( function() { – var c=$(this).attr('href'); – var b='https://' + location.host.replace(location.host.split('.')
[0],'www')+c; – $(this).attr('href',b); } );
• };
• jQuery('li.course-navigation-course').find('a[href]').convertUsertoWWW();