Home > Web Front-end > JS Tutorial > body text

Textarea and lazy rendering implementation code_javascript skills

WBOY
Release: 2016-05-16 17:57:44
Original
949 people have browsed it

The code is as follows.

Copy code The code is as follows:


Render content immediately

  • Zhang San

  • Zhang Si






<script> <br>setTimeout(function(){//Lazy rendering <br>var el =document.getElementById('lazyRender01'); <br>el.parentNode.innerHTML = el.value; <br>},1000); <br></script>

The advantage of the code is that the content corresponding to Li San and Li Si will not form a dom node and will not request images before lazy rendering.
But some students will ask: "The content in Textarea is not friendly to search engines."
No problem, this is easy to solve:
Copy code The code is as follows:


Render content immediately

  • Zhang San

  • Zhang Si

  • < /ul>


<script>document.write('<textarea id="lazyRender01" style="display:none">'); </script>
Lazy rendering of content

  • 李三

  • < li>李思



< ;script>
setTimeout(function(){//Lazy rendering
var el =document.getElementById('lazyRender01');
el.parentNode.innerHTML = el.value;
},1000 ;
But the result is very different: even if the browser does not support js, all content can still be displayed as is.
Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template