如何正确编码函数以异步加载
how to properly code a function to load asynchronously
我正在尝试使随机颜色函数加载得更快。 目前,页面在页眉中加载随机颜色div 之前加载页面上的所有内容。 该函数有效,但加载需要很长时间。 下面是随机颜色函数的当前代码。
在正文标签中是:
onload="return ran_col()" style="!important;"
在正文中是一个div,后面有一个脚本:
<div id="parallelogram" class="desktop-6 tablet-4 mobile-3">
<div id="logo" class="desktop-6 tablet-4 mobile-3">
<a href="/"><img src="{{ 'logo.png' | asset_url }}" alt="{{ shop.name }}" style="border: 0;"></a>
</div>
</div>
<script type="text/javascript">
function ran_col() { //function name
var color = '#'; // hexadecimal starting symbol
var letters = ['81ADB5','97C29D','E86A72','F1B36C', 'A37EA3', '277F92'];
color += letters[Math.floor(Math.random() * letters.length)];
document.getElementById('parallelogram').style.background = color; }
</script>
我正在尝试将此功能与setTimeout()
结合使用,以便页面立即加载随机颜色div。 下面是我在一篇关于如何加速 JavaScript 的文章中找到的示例:
var a = 3, b = 5;
function addNumbers (a, b) {
return (a+b);
}
// this will run the code immediately
setTimeout('var c = addNumbers(a,b)', 1);
console.log(c);
我已经尝试了几种配置,但我是 JavaScript 的新手,并且没有任何运气来完成这个。 关于如何正确设置的任何建议? 任何建议将不胜感激。 提前谢谢你。
你只是将你的函数暗示到 setTimeout 中:
function ran_col() { //function name
var color = '#'; // hexadecimal starting symbol
var letters = ['81ADB5','97C29D','E86A72','F1B36C', 'A37EA3', '277F92'];
color += letters[Math.floor(Math.random() * letters.length)];
document.getElementById('parallelogram').style.background = color; }
setTimeout(ran_col,1);
相关文章:
- 用于测试javascript中异步加载的脚本的工具
- 从要使用Protractor测试的服务器异步加载的动态数据列表的列表
- 异步加载角度控制器和工厂
- 加载 JavaScript 取决于以前异步加载的 JavaScript
- 按顺序异步加载JS脚本(等待上一个脚本完成)
- 在照片查看器(Javascript和jQuery)中异步加载图像时可能出现错误
- 异步加载的SVG过滤器feColorMatrix在Chrome中工作,而不是在Safari或Firefox中
- 异步加载Javascript
- 从框架中的函数异步加载 Javascript
- 异步加载特定的 CSS,并在加载时删除等待消息
- 异步加载 NPM 模块
- 如何使rails上的所有图像异步加载视图页面
- 任何控制Javascript异步加载顺序的方法
- 异步加载JQuery时Tabbed Box已损坏
- 脚本和图像是同步加载还是异步加载
- 使用TypeScript和Promises异步加载/卸载内容
- 异步加载脚本
- 在Rails4中使用Sprockets和Turbolinks时如何异步加载javascript
- 正在检测异步加载的按钮
- 异步加载ASP.NET绑定的Javascript,然后调用回调