如何使用Javascript仅为一个特定页面加载CSS文件？

Question

I am working on a shopping cart on Netsuite coded with nested tables... I know it sucks.

Because I only have access to fields to customize the website I need a JS snippet to be able to load a specific CSS file for the shopping cart (to avoid styling the rest of the website)

I have never done that before, here is how I would start:

<script type="text/javascript">
var path = window.location.pathname;
if(path.indexOf('/Cart') !=-1 {
  // load css file
}
</script>

What code would do that for me?

Answer 1

Aside from closing your if(... with a ) , this should get you going:

var styles = document.createElement("link");
styles.rel = "stylesheet";
styles.type = "text/css";
styles.href = "file.css";  // your file's URL
document.getElementsByTagName("head")[0].appendChild(styles);

Answer 2

While testing the url does work there is a better way to add tab and category specific markup.

In your website theme in the "Additions to Head" section add a tag <TAB_ADDONS> and add that to the site builder Tags but with a blank body

Then go to your list of tabs and find the shopping cart tab. Edit it and select Tag Overrides find TAB_ADDONS and enter:

<link rel="stylesheet" type="text/css" href="file.css">

you'd use the root relative url for the href.

This keeps your theme much cleaner and allows arbitrary code inclusions.