Dynamic Loading of image paths ensures the relative independence of JavaScript controls

At that time, three methods were considered:
1. Write the path directly in the js file, but if the reference page path level changes, it will be the same.
2. Write a class, place it in the css file in the topic package, or create a css file separately for the date control. However, other elements in the control do not need to use the class. It seems that it is a big question to create a css document separately.
3. After the above two methods are excluded, we naturally need to dynamically load the image path.
The key code is as follows:
Copy codeThe Code is as follows:
// Create a save path for global variables
Var imgRootUrl = "";

// Obtain the directory of the image path
Var strpath=w.doc ument. location. pathname; // The Directory section after obtaining the host address
Var thisUrlCount = strPath. split ('/');
Var hierarchyOfFolders = thisUrlCount. length-2; // get the directory level
For (iRoot = 0; iRoot {
ImgRootUrl + = "../";
}
ImgRootUrl + = "Images/"; // This Images can also be set as a parameter. Because all project image folders have fixed names, no parameters are set, but they still save the scalability.

After adding a chart, the control effect is quite beautiful:

The following attributes are attached to all specified parameter Doc ument. location:
Part after document. location. hash // # VS window. location. hash
Document. location. host // domain name + port number
Document. location. hostname // Domain Name
Document. location. href // complete URL
Document. location. pathname // directory (Application)
Document. location. port // port number
Document. location. protocol // network protocol (http :)
Document. location. search //? Part after