隐藏HTML表单使用javascript加载页面之前

Question

我想在使用JavaScript加载页面之前就隐藏HTML表单。

我能够使用display ='none'样式属性使用javascript隐藏表单，但是表单内容会消失一秒钟后才可见。

var searchbar = document.getElementById("searchform");
searchbar.style.display = 'none';

我已经阅读了stackoverflow中的许多解决方案，并在页面中添加了一些CSS代码，并稍后使用removeClass显示内容。

问题是我无权访问网页后面的代码以添加CSS内容 。 但是我只能在页眉或页脚中添加一些自定义javascript代码。（也不能使用jQuery）。

请让我知道它是否可能按预期隐藏了form元素。 我对javascript还是很陌生。 请提供您宝贵的建议。

Answer 1

您可以将所有表单存储在javascript变量中，并在页面准备好后将其写入div中

简单的例子：

function showForm(){
    var container = $('#formContainer');
    var form = '<input type="text" name="myInput">'; // Or you can load it from an external file
    container.html(form);
}

$(document).ready(function(){

    showForm();

});

但是最好的方法是添加一个CSS规则来隐藏您的表单，并在页面加载时显示它。

Answer 2

编辑：对不起，如果您只能使用某些javascript并且无法访问html或css，则可能无法解决您的问题。

Answer 3

Web浏览器首先呈现HTML。 浏览器下载css或js文件需要花费时间。 最好的方法是使用内联display ='none'，而不是在CSS文件中。

<form style="display:none;">
   ...
</form>