Necrotizing Pineapple Music
    Share your code. npm Orgs help your team discover, share, and reuse code. Create a free org »



    Automatically adds html5 audio elements inline beside links to mp3, ogg, and wav files.

    Where do I get it?

    You can download it from github at or, if you have node installed you can get it from npm

    npm install audio-tag-injector


    Using this module in your browser is as simple as including it in your page and calling audioTagInjector() after the page has loaded. See example.html in the root directory of this package.

    The HTML5 audio tags will be added inline where this script finds a link whose href attribute ends in mp3, wav, or ogg. A basic error handler is added to the audio element to inform the user if the audio file couldn't load. The audio element also displays an error message if it is not supported in the users browser.

    If you're using this module outside of a browser you will have to supply a reference to a dom document object, unless you've called it document and declared it globally. I did not require any specific module for parsing the DOM, because there are a few out there and it would be rude of me to force you to use a specific one for such a simple function.

    Injection of Audio Tags in Browser

    <!DOCTYPE html>
            <script src="./node_modules/audio-tag-injector/src/audio-tag-injector.js"
                Example Usage of audio-tag-injector.js
                Example Usage of audio-tag-injector.js
                Ooh! I made some audio! Check it out <a href="/some_audio_file.mp3">Kastor at the mic!</a>
            <script type="text/javascript">

    Injection of Audio Tags in Node

    // parse your html into a DOM Document using jsdom
    // or something
    var fs = require('fs'); 
    var jsdom = require("jsdom").jsdom;
    var audioTagInjector = require('audio-tag-injector');
    var html = fs.readFileSync('example.html', 'utf8');
    // javascript written for the browser expects global
    // window and document objects
    var document = global.document = jsdom(html, null, {
        features: {
            FetchExternalResources : false,
            ProcessExternalResources : false
    var window = global.window = global.document.parentWindow;
    // alternatively, if you've called the 
    // document object something other than 
    // document, you may supply it as the 
    // first argument and everything will 
    // work out fine.
    // audioTagInjector(nonstandardDocumentReference);
    // Shazam. The document now contains audio 
    // tags you didn't have to write.




    npm i audio-tag-injector

    Downloadsweekly downloads








    last publish


    • avatar