homepage Welcome to WebmasterWorld Guest from
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Pubcon Gold Sponsor 2015!
Home / Forums Index / Code, Content, and Presentation / JavaScript and AJAX
Forum Library, Charter, Moderator: open

JavaScript and AJAX Forum

How does this code run?

5+ Year Member

Msg#: 4512050 posted 2:24 am on Oct 25, 2012 (gmt 0)

How does this code run? This is using jQuery to use JS to run CSS. For times when JS is off. Works perfect. It adds the class .js-on to the html if js in on. My question is this? I want to place all this code at the bottom of the page. I was surprised it works this way. Does the browser have to travel all the way back up to find the html tag (thus slowing it down?) or does it work different. I have 5 different ways to do this. I'm looking for the fastest. This way is clean because I already have jquery library on the page. Thanks.

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
<style type="text/css">
html.js-on #method1 {color:red;}

<p id="method1">Method #1</p>


JAB Creations

WebmasterWorld Senior Member jab_creations us a WebmasterWorld Top Contributor of All Time 10+ Year Member

Msg#: 4512050 posted 7:52 pm on Oct 25, 2012 (gmt 0)

Don't use jQuery or any other frameworks, they're not real code, they'll lead you as far away from writing real code and you'll end up having no comprehension over what you're trying to do. Figure out how the DOM works in conjunction with JavaScript.

function setstylebyid(i,p,v) {var n = document.getElementById(i); if (n != null) {n.style[p] = v;}}

- John


WebmasterWorld Senior Member 5+ Year Member

Msg#: 4512050 posted 1:58 am on Oct 28, 2012 (gmt 0)

Keep the style declaration in the head section.

If there is existing style declaration add line "html.js-on #method1 {color:red;}" to it will suffice.

I already have jquery library on the page

Then do no include include it a second time with
<script type="text/javascript" src="jquery.js"></script>

When a statement like:
<script type="text/javascript" src="jquery.js"></script>
is included in head section, page load is delayed until jquery.js is loaded.

To reduce delay it can be placed at end of body. If you do that, script like
$('html').addClass('js-on'); will need to be moved also as it relies on jquery.js being loaded.

So if you decide to put script in body, you will need to consider all script on page, and possibly move it all.

Global Options:
 top home search open messages active posts  

Home / Forums Index / Code, Content, and Presentation / JavaScript and AJAX
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved