Here is the HTML part, content is a null links (#) -- -- -- -- -- -- -- a thumbnail li label id is thumbnail
<meta charset="utf-8">No title documents & lt;/title> <br/></head> <br/><br/><body> <br/><Ul> <br/><Li id="thumnail" & gt; <A href="https://bbs.csdn.net/topics/" title="rhino" & gt; <br/><Img SRC="https://bbs.csdn.net/topics/media/thumbnail.jpeg" Alt="rhino"/& gt; <br/></a & gt; </li> </ul> <br/><br/><The script type="text/javascript" SRC="https://bbs.csdn.net/topics/ques.js" & gt; </script> <br/></body> <br/></html> <br/><br/></pre> <br/><br/><br/><br/><br/><br/><br/><br/>The following part is JS: <br/><pre> <br/><br/>//JavaScript Document <br/>//create a div in a web page, and create the contents: <br/>The function create1 () {<br/>Var cre_div=document. The createElement method (" div "); <br/>Var cre_img=document. The createElement method (" img "); <br/>Var cre_p=document. The createElement method (" p "); <br/>Var cre_tex=document. CreateTextNode (" if code successfully able to see the paragraph ") <br/><br/>Cre_div. SetAttribute (" id ", "the1"); <br/>Cre_img. SetAttribute (" id ", "pic1"); <br/>Cre_img. SetAttribute (" SRC ", "media/picture. JPG"); <br/>Cre_img. SetAttribute (" Alt ", "the1"); <br/>Cre_p. SetAttribute (" class ", "p1"); <br/><br/>Cre_div. The appendChild (cre_img); <br/>Cre_div. The appendChild (cre_p); <br/>Cre_p. The appendChild (cre_tex); <br/>Window. The ducument. GetElementsByTagName (" body ") [0]. The appendChild (cre_div);//add window here. Because without error said ducument is not defined, ridiculous, I added a window. In the previous, <br/>} <br/><br/><br/><br/>//to bind with the mouse to click the above function behavior <br/>The function implement () {<br/>Var xiniu=document. GetElementById (" thumbnail ") <br/>Xiniu. Onclick=function () {create1 (); <br/>} <br/>} <br/><br/><br/>//page load at the end of the executive function: (comes from "Javascript dom programming art second edition") <br/>The function addLoadEvent (func) {<br/>Var oldonload=window. onl oad; <br/>If (typeof window onl oad!='function') {<br/>Window. The onl oad=func; <br/>} else {<br/>Window. The onl oad=function () {<br/>Oldonload (); <br/>Func (); <br/>} <br/>} <br/>} <br/>AddLoadEvent (implement);//to perform functions on this -- -- -- -- -- -- -- -- -- -- -- here, said after the page is loaded, implement function can run, as long as the mouse click away, <br/><br/><br/></pre> <br/><br/>Open a browser, you can see a rhinoceros thumbnails, originally envisioned by clicking on the thumbnail, will load a picture + text paragraphs, but no response, <br/><img SRC="https://img.codepudding.com/202010/143251112256411.png" Alt=""/> </div> <div class="th_page th_page_color"></div> <div class="umCopyright"> <p>Page link：<a href="/frontend/62422.html" target="_blank" style="color:#999">https//www.codepudding.com/frontend/62422.html</a></p> </div> <div class="detail-arr"> <div class="detail-arr-left">Prev:<a href='/frontend/62421.html'>Ajax to send data to the back-end, the back-end to receive less than the cause of the request</a></div> <div class="detail-arr-right">Next:<a href='/frontend/62423.html'>Js on mocha test will use three methods</a></div> </div> </div> </div> </div> </div> <div class="container th_top"> <div class="row"> <div class="col-md-12"> <div class="hot-tags neitags"> <ul> <li><i class="iconfont icon-x-tags"></i> Tags： </li> <a href='/e/tags/?tagname=JavaScript' target='_blank'>JavaScript</a> </ul> </div> </div> </div> </div> <div class="container th_top"> <div class="row"> <div class="col-md-12"> <div class="xiangguan"> <ul class="msg msghead"> <li class="tbname">Related</li> </ul> <ul> </ul> </div> </div> </div> </div> <div class="container th_top"> <div class="row"> <div class="col-md-12"> <div class="flinks"> <ul> <li><i class="iconfont icon-x-tags"></i> Links： </li> <li class="liflinks"><a target="_blank" href="/" title="CodePudding">CodePudding</a></li> </ul> </div> </div> </div> </div> <div class="footer"> <p><span style="font-size:16px;color:#666;font-weight: bold">About Us:</span> <a href="https://www.codepudding.com/contact.html">Contact Us</a> <a href="https://www.codepudding.com/service.html">Terms of Service</a> <a href="https://www.codepudding.com/privacy.html"> Privacy Policy</a></p> <p class="foot_info">Copyright © 2010-2023，Powered By <a href="/" target="_blank">CodePudding</a> </p> </div> <script type="text/javascript" src="/skin/code/tianhu.js"></script> </body></html>