大家好，今天Win10系统之家小编给大家分享「如何查看网页的js」的知识，如果能碰巧解决你现在面临的问题，记得收藏本站或分享给你的好友们哟~，现在开始吧！

1.如何查看完网页加载的javascript

　　&lt;p&gt;写了一下 jquery 的。javascript 只是要多些几个函数来获取元素相对页面的 offset，这个问题 (536001082) 里面有。&lt;/p&gt; &lt;p&gt;<br>&lt;/p&gt; &lt;p&gt;大致思路：document ready - 替换图片的 src - 加载当前可见图片 - 当鼠标滑轮操作时加载可见区域内图片。&lt;/p&gt; &lt;p&gt;<br>&lt;/p&gt; &lt;p&gt;在 ie，firefox，chrome，safari 下测试都没问题。opera 不加载，还没调试，随它去吧、、、&lt;/p&gt; &lt;p&gt;<br>&lt;/p&gt; &lt;p&gt;下面的代码只是大概框架，具体还要根据个人需求调整。建议使用网上写好的插件，考虑到的方面比较全。&lt;/p&gt; &lt;p&gt;<br>&lt;/p&gt; img {display: block; border: 1px solid #f00; margin-bottom: 400px;}&lt;p&gt;<br>&lt;/p&gt; &amp;lt;!-- 在网上找几张尺寸较大图片，更换地址 --&amp;gt;<br>&amp;lt;!-- 还需要一张 loading.gif，和 html 文件放在一起 --&amp;gt;<br>&amp;lt;div id=&quot;gallery&quot;&amp;gt;<br>&amp;lt;img src=&quot;1.jpg&quot; /&amp;gt;<br>&amp;lt;img src=&quot;2.jpg&quot; /&amp;gt;<br>&amp;lt;img src=&quot;3.jpg&quot; /&amp;gt;<br>&amp;lt;img src=&quot;4.jpg&quot; /&amp;gt;<br>&amp;lt;img src=&quot;5.jpg&quot; /&amp;gt;<br>&amp;lt;img src=&quot;6.jpg&quot; /&amp;gt;<br>&amp;lt;/div&amp;gt;&lt;p&gt;<br>&lt;/p&gt; &amp;lt;script type=&quot;text/javascript&quot; src=&quot;jquery.js&quot;&amp;gt;&amp;lt;/script&amp;gt;<br>&amp;lt;script type=&quot;text/javascript&quot;&amp;gt;<br>$(function() {<br> function load_images() {<br> // 延时 0.1 秒再执行函数<br> // 如果立即执行，firefox 会返回错误的 offset().top<br> settimeout(function() {<br> // 检查每一个图片<br> $(&quot;#gallery img&quot;).each(function() {<br> var self = $(this);<br> // 确认图片在可视范围之内<br> var _ot = $(this).offset().top,<br> _st = $(document).scrolltop();<br> if(_ot - _st &amp;gt; 0 &amp;amp;&amp;amp; _ot - _st &amp;lt; $(window).height()) {<br> // 创建新的 img 对象<br> var img = new image();<br> // 图片加载成功<br> img.onload = function() {<br> // 还原 width 和 height<br> if(self.attr(&quot;data-width&quot;)) {<br> self.attr({<br> &quot;width&quot;: self.attr(&quot;data-width&quot;)<br> });<br> }<br> else {<br> self.removeattr(&quot;width&quot;);<br> }<br> // 没有用户自定义 width 和 height 属性，移除<br> if(self.attr(&quot;data-height&quot;)) {<br> self.attr({<br> &quot;height&quot;: self.attr(&quot;data-height&quot;)<br> });<br> }<br> else {<br> self.removeattr(&quot;height&quot;);<br> }<br> // 更改图片 src<br> self.attr(&quot;src&quot;, self.attr(&quot;data-src&quot;));<br> // 释放<br> img = null;<br> };<br> img.onerror = function() {<br> //alert(&quot;图片加载失败&quot;);<br> // 释放<br> img = null;<br> };<br> // 开始加载图片<br> img.src = self.attr(&quot;data-src&quot;);<br> }<br> });<br> }, 100);<br> }<br><br> // 只对 #gallery 内的 img 进行缓载<br> $(&quot;#gallery img&quot;).each(function() {<br> $(this).attr({<br> // 保存原属性<br> &quot;data-src&quot;: $(this).attr(&quot;src&quot;),<br> &quot;data-width&quot;: $(this).attr(&quot;width&quot;) || &quot;&quot;,<br> &quot;data-height&quot;: $(this).attr(&quot;height&quot;) || &quot;&quot;,<br> // 将 src 换为加载图片，并设置宽度和高度<br> &quot;src&quot;: &quot;loading.gif&quot;,<br> &quot;width&quot;: 64,<br> &quot;height&quot;: 64,<br> });<br> });<br><br> // 页面加载的时候开始加载可视图片<br> load_images();<br><br> // 当鼠标滑轮滚动时<br> var timeout_loading_images = null;<br> $(document).on(&quot;scroll&quot;, function() {<br> // 如果用户还在进行滑轮滚动，不要试图加载<br> cleartimeout(timeout_loading_images);<br> // 滑轮滚动停止一秒后开始加载<br> timeout_loading_images = settimeout(function() {<br> load_images();<br> }, 1000);<br> });<br>});<br>&amp;lt;/script&amp;gt;

以上就是关于「如何查看网页的js」的全部内容，本文讲解到这里啦，希望对大家有所帮助。如果你还想了解更多这方面的信息，记得收藏关注本站~

【文♀章②来自Win10系统之家，转载请联系网站管理人员！】