Question

My html has an extension which embeded by other application:

document.documentElement.appendChild((function () {
    var objectElement = document.createElement("embed");
    objectElement.setAttribute("id", "my-plugin");
    objectElement.setAttribute("type", "application/x-my-app");
    objectElement.setAttribute("width", "0");
    objectElement.setAttribute("height", "0");
    return objectElement;
}()));

Normally we get this object by its id: var plugin = document.getElementById("my-plugin");

The problem here is, the object is injected by other apps and its ID could vary. I only know its MIME type is “x-my-app”, but looks like there is no getElementByType() to get it?

Answer 1

On sufficiently advanced browsers you can use querySelector()/querySelectorAll():

document.querySelector("embed[type='application/x-my-app']")

If using jQuery, the following will work even on less sufficiently advanced browsers:

$("embed[type='application/x-my-app']")

If neither, you can loop over all the <embed> tags:

result = [];
var embeds = document.getElementsByTagName('embed');
for (var i = 0; i < embeds.length; i++) {
    var embed = embeds[i];
    if (embed.type === type) {
        result.push(embed);
    }
}

jsFiddle example of all three.