如何让一个网页一次性加载完所有内容,而不是每一次点击一下加载一部分,以下为网页源代码。

html-css034

如何让一个网页一次性加载完所有内容,而不是每一次点击一下加载一部分,以下为网页源代码。,第1张

这个问题我认为包括两个方面,一个方面是网页的容量,容量太大的无法一次加载全部。

另一方面在设置,浏览器的设置决定你的加载容量,例如我在使用微博的时候设置上可能自己设置:一次性加载:5条,10条,15条……等选项,具体看浏览器设置就可以了。

<style>

.class1{font-weight:boldfont-size:45px}

.class2{color:red}

</style>

<div class="class1 class2">asdfa</div>

更多的类,同理

<div class="listclass">

<ul id="listlistssssss">

<li></li>

<li></li>

<li></li>

</ul></div>

<script src="js/dropload.min.js"></script>

<script type="text/javascript">

var u = navigator.userAgent, app = navigator.appVersion

var isAndroid = u.indexOf('Android') >-1 || u.indexOf('Linux') >-1//android终端或者uc浏览器

//var isiOS = !!u.match(/\(i[^]+( U)? CPU.+Mac OS X/)//ios终端

/*alert('是否是Android:'+isAndroid)

alert('是否是iOS:'+isiOS)*/

$(function(){

// 页数var page = 0

// 每页展示10个

var size =5

// dropload

$('.listclass').dropload({

scrollArea : window,

loadDownFn : function(me){

page++

// 拼接HTML

var result = ''

$.ajax({

type: 'get',

url: "text.txt",

dataType: 'text',

success: function(data){

//alert(222)

var arrLen = data.length

if(arrLen >0){

//for(var i=0i<arrLeni++){

//var html = $("#listlist").html()+data

// alert(html)

$('.dropload-refresh').html('加载更多...')

$('.dropload-refresh').css('font-size:','1.875rem')

// me.resetload()

// }

// 如果没有数据

//alert(arrLen )

}else{

// 锁定

me.lock()

// 无数据

me.noData()

}

// 为了测试,延迟1秒加载

// setTimeout(function(){

// 插入数据到页面,放到最后面

// $('.listclass').append(result)

$('#listlistssssss').append(data)

// 每次数据插入,必须重置

me.resetload()

// },1000)

},

error: function(xhr, type){

alert('Ajax error!')

// 即使加载出错,也得重置

me.resetload()

}

})

}

})

})

</script>