Wie kann man code in eine JavaScript-Datei die Datei-URL?

Brauche ich, um dynamisch geladen, ein CSS-stylesheet in eine Seite, die auf eine verschiedenen domain. Wie bekomme ich die vollständige URL der JS-Datei an, in der href - Attribut des stylesheet?

Zum Beispiel, hier ist die Struktur:

http://bla.com/js/script.js

http://bla.com/css/style.css

Möchte ich dynamisch geladen, das stylesheet in eine Seite http://boo.net/index.html. Das problem ist, ich weiß nicht, die bla.com bisschen im Voraus, nur die Tatsache, dass das stylesheet ist in ../css/ relativ zu der JS-Datei.

Das Skript ist natürlich, auf index.html. jQuery ist ja auch in Ordnung.

InformationsquelleAutor montrealist | 2009-08-14

  1. 15

    Fügen Sie eine ID an das script-tag:

    <script type="text/javascript" id="myScript" src="http://bla.com/js/script.js"></script>

    Und in http://bla.com/js/script.js:

    var myScript = document.getElementById('myscript');
var myScriptSrc = myScript.getAttribute('src');
alert(myScriptSrc); //included for debugging

    Sollten Sie in der Lage zu manipulieren, um den Wert von myScriptSrc zu erhalten, der Pfad zu jedem anderen Inhalt bla.com.

    Ich denke, dieses Beispiel ist, was James Black gemeint in seiner Antwort.

    Schließlich jeder was auf die Verwendung von document.location bitte beachten Sie, dass, wenn Sie wollen, nur-lese-Zugriff auf die aktuelle Adresse der Seite, die Sie verwenden sollten document.URL oder window.location. Wenn Sie möchten, legen Sie die Adresse der Seite, sollten Sie immer window.location.href. Obwohl window.location = 'location'; funktioniert, es hat mich immer gestört, um zu sehen, eine Zeichenfolge zugewiesen wird, um einen Speicherort. Ich bin mir nicht sicher, warum, weil JavaScript ermöglicht es, alle Arten von anderen impliziten Typ-Konvertierungen.

    • mozilla Referenz: document.location war ursprünglich ein nur-Lesen-Eigenschaft, obwohl Gecko-Browser können Sie zuweisen, um es als gut. Für cross-browser-Sicherheit, verwenden Sie Fenster.Lage statt. Zum abrufen der URL als string, der nur-lese - Dokument.URL Eigenschaft kann verwendet werden.
    • Sun Referenz: Verwenden Sie nicht Lage als eine Eigenschaft des document Objekt; verwenden Sie die Dokument.URL - Eigenschaft statt. Die document.location Eigenschaft, die ein synonym für document.URL, ist veraltet.
    Schön. Moll beiseite: offiziell, HTML4 nicht erlaubt eine id in <script>. HTML5 macht.

    InformationsquelleAutor Grant Wagner

  2. 7

    Mit Jquery, du könntest etwas wie:

    $('script[src$="my_script.js"]').attr('src').replace('my_script.js','');
//outputs something like: "/static/js/"
    Sehr nützlich, wenn es keine id auf das Skript-tag und es ist eine partner-code, wo Sie nicht eine DOM-id Hinzugefügt.
    Hervorragende one-liner!

    InformationsquelleAutor Toby

  3. 5

    Sogar einfacher als mit einem id ist, lassen Sie einfach das markup alleine und verwenden Dokument.currentScript. Der link zu MDN erwähnt unter dem Hinweise Abschnitt, eine kleine Eigenart, dass der JavaScript-synchron ausgeführt, und ich bin zu erklären, wie diese Falle zu vermeiden.

    Es ist wichtig zu beachten, dass dies nicht auf die <script> element, wenn Sie den code in das Skript aufgerufen wird, als eine callback-oder event-handler; es wird nur auf das element, während es zunächst verarbeitet werden.

    Der Vorteil dieser Lösung ist, dass Sie nicht erforderlich sind, um spezielle markup, und dies ist besonders hilfreich, wenn Sie keinen Zugriff auf die HTML-sich aus irgendeinem Grund (z.B. wenn es ein client oder ein Entwickler mit der API).

    Wenn das Skript synchron ausgeführt (d.h. die wesentlichen Inhalte des Skripts ist nicht eingewickelt in ein Ereignis-listener oder eine andere Funktion zu bewerten, als später, wenn der code "zunächst wird verarbeitet" ), können Sie einfach document.currentScript Zugriff auf die aktuell verarbeitet <script> element Ihres Codes. Um zu zeigen, wie diese effektiv, ich werde bieten ein basic-demo-unten.

    HTML:

    <script type="text/javascript" src="http://bla.com/js/script.js"></script>

    JavaScript in http://bla.com/js/script.js:

    var myScript = document.currentScript,
    mySrc = myScript.getAttribute('src');

console.log(mySrc); //"http://bla.com/js/script.js"

$(function () {
    //your other code here, assuming you use jQuery
    //...
});

    Wenn Sie nicht wollen, dass die variable ausgesetzt werden, um die Globale Reichweite, Sie kann dies auch tun:

    (function () {
    var myScript = document.currentScript,
        mySrc = myScript.getAttribute('src');

    console.log(mySrc); //"http://bla.com/js/script.js"

    $(function () {
        //your other code here
        //...
    });
}()); //self-executing anonymous function

    Im Grunde der Punkt ist, um sicherzustellen und den Zugang document.currentScript während synchrone Ausführung des Skripts, sonst wird es nicht Referenz, was man erwartet.

    Diese Antwort verdient mehr Stimmen!!

    InformationsquelleAutor Patrick Roberts

  4. 4
    var JS_SELF_URL = (function() {
    var script_tags = document.getElementsByTagName('script');
    return script_tags[script_tags.length-1].src;
})();

    Als der browser analysiert tags, lädt es auch und führt Sie aus. Deshalb, wenn Sie Ihre JS-Datei ausgeführt wird, ist es derzeit der Letzte tag analysiert.

    Vermeiden Sie dies, wenn mit async Schlüsselwort.
    Das ist schrecklich und ich Liebe es. Upvote x 100+

    InformationsquelleAutor bradt

  5. 0

    Lesen Sie document.location, aber Sie konnte auch nur relative URLs verwenden,

    Soweit ich weiß, zu dokumentieren.Speicherort gibt den URI des aktuellen Dokuments, nicht die JS-Datei in dem der code ausgeführt wird.

    InformationsquelleAutor bjelli

  6. 0

    Sehen Sie im script-tag für die javascript-Standort, und durch die Verwendung von Dokument.Lage könnte Sie wahrscheinlich bestimmen die relative Adressierung verwendet, um zu bestimmen, wo die css-Datei auch sein mag.

    InformationsquelleAutor James Black

  7. 0

    Stack-Eigenschaft des error-Objekte bieten können URL-Informationen.

    try 
{ 
  throw new Error();
}
catch(exc)
{
  console.log(exc.stack);
}

    Leider Webkit nicht (aber Chrom macht) - support-Stapel-Eigenschaft. Es gibt einige Browser unterstützen diese Funktion: http://173.45.237.168/reference/html/api/Error.html#Error.stack

    Anstelle von stack-Webkit bietet sourceURL Immobilie, hier ist die exampe Verwendung:

    try 
{ 
  throw new Error();
}
catch(exc)
{
  console.log(exc.sourceURL);
}

    InformationsquelleAutor sid3k

Schreibe einen Kommentar