Wie man CSS mit jquery lädt

Question

Wie man CSS mit jquery lädt

Gefragt el 12 de Oktober, 2010: Wann wurde die Frage gestellt
98595 Ansichten: Anzahl der Besuche der Frage
4 Antworten: Anzahl der Fragenantworten
Gelöst: Aktueller Status der Frage

Ich habe eine css-Datei auf dem Server geladen, so dass ich eine URL mit mir haben. Wie kann ich es in meinem Perl-Code mit JQuery laden?

Also derzeit bin ich hardcoding die css in meinem mason Seite, die von der Seite etwas wie dieses fehlt

JQ.onReady('show', function(){
    JQ.addStyles({styles: ["\n\n.ap_classic { border-top:1px solid #ccc;border-left:1px solid #ccc;border-bottom:1px solid #2F2F1D; border-right:1px solid   #2F2F1D;background-color:#EFEDD4;padding:3px; }  .ap_classic .ap_titlebar { color:#86875D;font-size:12px;padding:0 0 3px 0;line-height:1em; }  .ap_classic .ap_close { float:right; }  .ap_classic .ap_content { clear:both;background-color:white;border:1px solid #ACA976;padding:8px;font-size:11px; } "]});
});

Ich möchte die Hardcodierung dieses Css vermeiden?

Gefragt el 12 de Oktober, 2010 von TopCoder

Answer 1

4 Antworten

Answer 2

85voto

pawel Punkte 33451

Ich verstehe nicht, warum man nicht einfach die <link/> Element in der <head/> Abschnitt, aber hier ist ein jQuery-Snippet:

$('head').append( $('<link rel="stylesheet" type="text/css" />').attr('href', 'your stylesheet url') );

Beantwortet el 12 de Oktober, 2010 von pawel (33451 Punkte )

Answer 3

48voto

ekerner Punkte 5354

Auch hier gilt, dass Dynamisch geladenes CSS-Stylesheet funktioniert nicht im IE .

Sie müssen die href-Attribute zuletzt und erst dann setzen, wenn das Link-Element an den Kopf angehängt ist:

$('<link>')
  .appendTo('head')
  .attr({
      type: 'text/css', 
      rel: 'stylesheet',
      href: '/css/your_css_file.css'
  });

Beantwortet el 15 de August, 2013 von ekerner (5354 Punkte )

Answer 4

2voto

Tudor Morar Punkte 3264

Ich mag es, wenn die Sprache und der Dateityp konsistent sind (z.B.: nicht css mit html mischen). Ich würde also eine style.css-Datei erstellen und sie mit jQuery in ein Tag laden.

index.html

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</head>
<body>
    <div>
        <style id="import"></style>
        <h2 class="red">this is red</h2>
    </div>
    <script type="text/javascript">
        $( document ).ready(function() {
            $( "#import" ).load( "./style.css" );
        });
    </script>
</body>
</html>

style.css

.red{
    color: red;
}

Beantwortet el 22 de Marsch, 2019 von Tudor Morar (3264 Punkte )

Answer 5

0voto

EMW Punkte 11

$(document).ready(function(){
    console.log("ready!");
var e=$("<link>",{
    rel:"stylesheet",
    type:"text/css",
    href:"/your/css/file.css"})[0];
e.onload=function(){
console.log("CSS IN IFRAME LOADED")},
document.getElementsByTagName("head")[0].
appendChild(e)});

Beantwortet el 22 de Marsch, 2019 von EMW (11 Punkte )

Wie man CSS mit jquery lädt

Antworten

Empfohlene Fragen

Top-Tags

CodeJaeger.com

Powered by:

Wie man CSS mit jquery lädt

Antworten

Verwandte Fragen

Empfohlene Fragen

Top-Tags

CodeJaeger.com

Powered by: