js替当前元素添加父节点 _JavaScript

js为当前元素添加父节点
现在有一些元素<select>,想在<select>元素前动态添加一个<span style="border: 1px solid red">元素。
用DOM该如何做？

------解决方案--------------------

JScript code

elem.insertAdjacentHTML("beforeBegin","<span style=\"border: 1px solid red\">*</span>");

------解决方案--------------------

JScript codeelem.insertAdjacentHTML("beforeBegin", "<span style=\"border: 1px solid red\">");
                elem.insertAdjacentHTML("afterend", "</span>");

------解决方案--------------------
HTML code<!doctype html>
<html>
    <head>
        <title>Test</title>
    </head>
    <body>
        <select>
            <option value="1">First</option>
        </select>
        <script>
            var sel = document.getElementsByTagName("select")[0],
                _sel = sel.cloneNode(true),
                span = document.createElement("span");
            span.style.border = "1px solid red";
            //span.style.cssText = "border: 1px solid red";
            span.appendChild(_sel);
            sel.parentNode.replaceChild(span, sel);
        </script>
    </body>
</html>