javascript优先加载笔记代码

函数部分

代码如下:

<script type="text/javascript">
function sysTab() {
$('#container > ul').tabs({ selected: 0 });
}
</script>

代码如下:

<body>

<div id="container"><!--需要加载的dom-->
<ul>
<li><a href="#fragment-1"><span>ルートフォルダの定義</span></a></li>
<li><a href="#fragment-2"><span>文書管理</span></a></li>
<li><a href="#fragment-3"><span>表示設定</span></a></li>
<li><a href="#fragment-4"><span>メール設定</span></a></li>
<li><a href="#fragment-5"><span>データベース管理</span></a></li>
<li><a href="#fragment-6"><span>フォルダ監視</span></a></li>
<li><a href="#fragment-7"><span>システム管理</span></a></li>
</ul>
.................
</div><!--需要加载的dom end-->

<script type="text/javascript">
sysTab();
</script> //提前加载函数
<!--剩余的大段代码-->
</body>

这样就可以在指定的dom输出完毕后就执行javascript,而不需要等待页面全部加载完毕。

(0)

相关推荐

  • javascript优先加载笔记代码

    函数部分 复制代码 代码如下: <script type="text/javascript"> function sysTab() { $('#container > ul').tabs({ selected: 0 }); } </script> 复制代码 代码如下: <body> <div id="container"><!--需要加载的dom--> <ul> <li><

  • 探析浏览器执行JavaScript脚本加载与代码执行顺序

    本文主要基于向HTML页面引入JavaScript的几种方式,分析HTML中JavaScript脚本的执行顺序问题 1. 关于JavaScript脚本执行的阻塞性 JavaScript在浏览器中被解析和执行时具有阻塞的特性,也就是说,当JavaScript代码执行时,页面的解析.渲染以及其他资源的下载都要停下来等待脚本执行完毕①.这一点是没有争议的,并且在所有浏览器中的行为都是一致的,原因也不难理解:浏览器需要一个稳定的DOM结构,而JavaScript可能会修改DOM(改变DOM结构或修改某个

  • javaScript和jQuery自动加载简单代码实现方法

    在此之前我们给大家整理过用javaScript和jQuery自动加载的几种方法,大家可以参考一下:javaScript 页面自动加载事件详解 一.JavaScript自动加载 ①在文本中用onload: 当页面中所有内容(包括图片)加载完后再执行onload,如下: <body onload="alert(1)"></body> <!-- 当有一个onload --> <body onload="alert(2);alert(3);a

  • JavaScript异步加载浅析

    前言 关于JavaScript脚本加载的问题,相信大家碰到很多.主要在几个点-- 1> 同步脚本和异步脚本带来的文件加载.文件依赖及执行顺序问题 2> 同步脚本和异步脚本带来的性能优化问题 深入理解脚本加载相关的方方面面问题,不仅利于解决实际问题,更加利于对性能优化的把握并执行.   先看随便一个script标签代码-- 复制代码 代码如下: <script src="js/myApp.js"></script> 如果放在<head>上面

  • javascript动态加载三

    之前两篇都介绍了,通过动态加载JS文件或者说JS模块,是怎么一步一步实现. 首先是通过同步策略来实现模块加载与回调函数之间进行分离,接着是通过异步策略来实现模块加载与回调函数之间进行分离. 这一篇,主要是为了说说怎么优化异步策略,并且实现了随意加载(非任意顺序加载模块),页面Ready之后加载文件.先接一下上一篇遗留下来的问题 1.页面Ready之后进行加载 2.随意添加模块 进行加载 看第一个问题,这个问题其实还是比较简单的,主要是监听页面的DOMContentLoaded事件,这里就不多讲解

  • 浏览器环境下JavaScript脚本加载与执行探析之defer与async特性

    defer和async特性相信是很多JavaScript开发者"熟悉而又不熟悉"的两个特性,从字面上来看,二者的功能很好理解,分别是"延迟脚本"和"异步脚本"的作用.然而,以defer为例,一些细节问题可能开发者却并不一定熟悉,比如:有了defer特性的脚本会延迟到什么时候执行:内部脚本和外部脚本是不是都能够支持defer:defer后的脚本除了会延迟执行之外,还有哪些特殊的地方等等.本文结合已有的一些文章以及MDN文档中对两个特性的阐述,对de

  • Javascript 异步加载详解(浏览器在javascript的加载方式)

    一.同步加载与异步加载的形式 1. 同步加载 我们平时最常使用的就是这种同步加载形式: <script src="http://yourdomain.com/script.js"></script> 同步模式,又称阻塞模式,会阻止浏览器的后续处理,停止了后续的解析,因此停止了后续的文件加载(如图像).渲染.代码执行. js 之所以要同步执行,是因为 js 中可能有输出 document 内容.修改dom.重定向等行为,所以默认同步执行才是安全的. 以前的一般建议

  • Google的跟踪代码 动态加载js代码方法应用

    复制代码 代码如下: <script type="text/javascript"> var _gaq = _gaq || []; //如果变量 _gaq 存在,就等于他自己,否则为一个空数组 _gaq.push(['_setAccount', 'UA-24479793-2']); //是个2维数组 _gaq[0] = array(0=>'_setAccount', 1=>'UA-24479793-2');(设置本跟踪代码所对应的Google帐户) _gaq.p

  • JavaScript动态加载样式表的方法

    本文实例讲述了JavaScript动态加载样式表的方法.分享给大家供大家参考.具体如下: 如果需要更换皮肤,我们可以通过JS代码动态加载皮肤的样式表,下面的代码就可以做到,非常简单,你只需要把这段代码做成函数动态调用即可. var el = document.createElement('link'); el.rel = 'stylesheet'; el.type = 'text/css'; el.href = 'http://www.jb51.net/...' + 'styles.css';

  • javascript动态加载二

    在上一篇javascript动态加载中,提到了使用同步加载策略这一个方式来实现如 复制代码 代码如下: Using("jquery"); Using("User"); $("#ID").click(function(){ var user = new User(); user.name = "xx"; user.show(); }); 由于JS是单线程的,所以同步策略带来的坏处不少,比如阻止之后的代码运行.造成浏览器假死等问题

随机推荐