简体   繁体   中英

How to load a full library with css and js to html?

Say i wrote some local library that contains js and css files (no html). This library has a js file with a class that get a DOM id as argument and load all css into that element independently.

I would like "share" that library, or just include it in my html page.

The only way I know currently, is to load each file from this folder separately like:

<link rel="stylesheet"  href="/lib/style.css"/>
<script src="lib/main.js"></script>

and so on.. which looks not clean and not right.

What is the right way to be able to load this library as a whole and everything inside , or at least all js inside, into an html page?

If I share this library, I don't want other devs to list and load each js/css .

You can use JavaScript to load CSS. Placing your script tag above the header section will load the CSS before your actual site.

Use a hosting like pastebin for some temporary CSS file hosting.

May not load the CSS fast but at the moment it's the solution I use for sharing my libraries.

<script>
         
        // Get HTML head element
        var head = document.getElementsByTagName('HEAD')[0];
 
        // Create new link Element
        var link = document.createElement('link');
 
        // set the attributes for link element
        link.rel = 'stylesheet';
     
        link.type = 'text/css';
     
        link.href = 'INSERTYOURLINKHERE';
 
        // Append link element to HTML head
        head.appendChild(link);
    </script>

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM