Javascript 加载文档后，我可以解析DOM元素吗？

我有一个选择框，我使用jQuery和设置其样式。
但由于脚本在

$（document）.ready

之后执行，因此会在一瞬间显示原始选择框，尤其是在连接速度较慢的情况下

因为我将选择框放在一个表中，所以已经为它分配了一个空间，这样就不会影响页面的呈现

我可以在页面加载后操纵此元素进行解析吗？这样，选择框的原始样式就不会显示。
这是解决这个问题的正确方法吗

示例代码：

<div id="header">
    <table>
        <tr>
            <td style="width:25%"></td>
            <td style="width:50%"></td>
            <td style="width:25%"><select class="chosen">
                    <option>Option 1</option>
                    <option>Option 2</option>
                    <option>Option 3</option>
                </select></td>
        </tr>
    </table>
</div>

<script type="text/javascript">
    $(document).ready(function() {
        $(".chosen").chosen({width: "75%", disable_search: true});
    });
</script>

选择1
选择2
选择3
$（文档）.ready（函数（）{
$（“.selected”）.selected（{width:“75%”，禁用搜索：true}）；
});

以下是我将如何应对这种情况。默认情况下，您可以在CSS中将

。选择的
设置为
显示：无

然后你可以这样写你的JavaScript

var sChosen = $(".chosen");
sChosen.chosen({width: "75%",disable_search: true});
sChosen.show(); // show the element after chosen() has taken effect

更新

CSS

JavaScript

var sChosen = $(".chosen");
sChosen.chosen({width: "75%",disable_search: true});
sChosen.css('visibility', 'visible'); // show the element after chosen() has taken effect

这是个好主意。但是有了这种方法，
可见性：隐藏将更合适。这取决于你想要的效果和你的用户期望，但我认为你提出了一个非常好的观点。它将向用户显示应该存在的内容。如果脚本如您所示位于表的正下方，则不要使用
.ready（）
。只需立即运行
$（“.selected”）.selected（…
代码。这将减少延迟。
var sChosen = $(".chosen");
sChosen.chosen({width: "75%",disable_search: true});
sChosen.css('visibility', 'visible'); // show the element after chosen() has taken effect