Question

I meet some problem when locate the resources such as css js img in the page.

For example,I want to use a javascript lib:dtree,it contain some built-in images and css.

This is its structure:

img
dtree.css
dtree.js
example.html

The exmaple.html is a live demo to show how to use dtree. It use the dtree.js as:

<script type="text/javascript" src="dtree.js"></script>

Now I create a new folder,and copy the example.html here,and modify the src of the js:

<script type="text/javascript" src="../dtree.js"></script>

Now,this is the new structure:

img
dtree.css
dtree.js
example.html
chd
--example.html

When I browser the chd/example.html,some required imgs are missing.

And in the dtree.js,there are some codes like:

this.icon = {
  root:'img/base.gif',
  ....
}

So I think the img here are not based on the dtree.js but the current page which call the js.

If so,I think I am fxxked.

I have to put all my pages to the same directory with the img(it contains the required imgs by dtree.js) if I want to use the dtree.js?

And solutions?

Answer 1

you need to adjust image root path by adding slash before img like:

this.icon = {
  root:'/img/base.gif',
  ....
}