HTML中引用JS 步骤如下:
1、打开电脑端html编辑器,然后新建HTML文件,以便待会用来引入js文件。
2、如图,如果想在head标签中使用javascript脚步,那么最好加入window.onload,然后在花括号里面写js代码。
3、而如果是在body下边,那就好办多了,可以直接在script里面写js代码,不需window.onload。
4、也可以新建js文件,把html和js分离。
5、然后在js文件里面写代码,注意不要用script标签。
6、然后在script里面用src来把之前的js文件链接好即可。
下面介绍三种异步执行加载Js 脚本的方法。1、直接document.write
<script language="javascript">
document.write("<script src='test.js'><\/script>")
</script>
2、动态改变已有script的src 属性
<script src='' id="s1"></script>
<script language="javascript">
s1.src="test.js"
</script>
3、动态创建 script元素
<script>
var oHead = document.getElementsByTagName('HEAD').item(0)
var oScript= document.createElement("script")
oScript.type = "text/javascript"
oScript.src="test.js"
oHead.appendChild( oScript)
</script>
注 ,
这三种方法都是异步的,所以在采用这类方法动态加载Js 的同时,主界面的Js脚本是继续执行的,所以可能出现通过异步加载的Js代码得不到预期的效果的情况。这时候可以考虑采用Ajax加载Js的方法。
大概原理 :用XMLHTTP取得要脚本的内容,再创建 Script 对象。另外注意编码的保持一致。因为服务器与XML使用UTF8编码传送数据。
思路:当滚动条到达底部时,调用js方法去加载数据
代码如下:<div style="height:1600pxborder:1px solid red">设高度模拟滚动</div>
//引入js
<script src="
</script>
<script type="text/javascript">
$(function () {
$(window).scroll(function () {
//浏览器所能看到的页面的那部分的高度
var winH = $(window).height()
var scrH = $(window).scrollTop()//滚动的高度
//获取整个页面的高度 htmH为设置的滚动到的高度位置
var htmH = $(document).height() - 100
//可见高度+滚动高度 超出 设置的高度,触发方法
if (winH + scrH >= htmH) {
//到达底部-100的高度,触发方法
alert(1)
}
})
})
</script>