KB Article 10147
2013/03/21

Close
X
Contact Tech Support

 Email Tech Support
 (250) 655-1766
 [7:30 - 5:00 PST]
Your Meeting ID will be Provided by a Rep.
Tech Support
Tech Support Home
Software Updates
Knowledge Base Search
Recent KB Articles
Product FAQs
Code Samples
Documentation
Tech Blog
System Requirements
Installation Instructions
Support Testimonials
Contact us to...
Create a Ticket
Request a Free Demo
Suggest a New Feature
Submit Feedback
Upload a Large File
Other Services
Software Training
Professional Services

Best practices for implementing your CSS and JavaScript

Product: WebSmart ILE Type: Frequently Asked Question

There are different ways to implement CSS and JavaScript codes to your webpage.

Inline declaration

Using inline code, you can declare the CSS style using either the style attribute, or some style attribute support by HTML document like width and height.

<div style="" width="" onclick="" ></div>

Similarly, you can attach JavaScript code to an event attribute like onclick or onload. A disadvantage to this approach is the clutter. For example, if you have 5 different input field where you want to clear the value, you will need to add the onclick attribute to each one.

Header tag

You can include your code in the head tag of your HTML document using the <script> or <style> tag. This helps reduce the clutter in your HTML document and gives a nice separation between the content of your webpage, the appearance, and the functions.


<script>
  jQuery(document).ready( function() {
    // do something when the content is loaded.
  });
</script>
<style>
  body {
    font-size:  12px;
  }
</style>

Declaring functions in the script tag also means you can reuse the function in multiple places accross the page.

External resources

Reference to an external file by specifying the source of the and the JS and CSS files using the link or script tag

<link rel="stylesheet" href="file.css"/>
<script src="file.js"></script>

The main benefit of putting your CSS and JavaScript code in an external files are the ability to share your code with other programs.

You can read more on other techniques to improve your web page at http://www.browserdiet.com/

Keywords: css javascript reference code maintenance
Last Update:20140410

Rate This Article

Did this example help you to achieve your goal?
 Yes  No  Don't Know

Enter additional comments below.   If you want to hear back from us, include your contact information.

Email Address:
Comments:
Please enable JavaScript in order to rate this page.