JSFiddle - React, Tailwind, and code Playground

HTML

<body>
    <iframe id="frame">
        <p>Your browser does not support iframes.</p>
    </iframe>
</body>

JavaScript

// Not really sure about another way if it's going to be pure js/html and nothing server-side

// Here's the location to the file
var file = "http://www.ieee.org/documents/ieeecopyrightform.doc",
    
// The frame being used
    frame = document.getElementById("frame"),

// Files that will be allowed to be embedded based on extension
    extensions = ["pdf"],
    
// This will tell us if it's right or not
    correct = false;

// Loop through the extension list
for(var i = 0; i < extensions.length; i++){
    // Check if the file url ends with the given extension
    if(file.substring(file.lastIndexOf(".")+1) == extensions[i]){
        // All conditions met, set to true!
        correct = true;
    }
}

if(correct){
    // Yay, it's correct!
    frame.src = file;
}else{
    // It's wrong, show something else!
    frame.src = "http://example.com";
}