This article describes the method of JS implementing the JS file contents after hiding elements of the same level. Share it for your reference, as follows:
After opening the demo.html file here, it will briefly display elements of the same level as the js file and hide these elements immediately, and display the content of the demo.js file at the same level. The specific code is as follows:
demo.html:
<!DOCTYPE html><html lang="zh-cn"><head><meta charset="UTF-8"><title></title></head><body><p>Head information</p><div> <p>Who asked you to recite the water fall</p><p>Who asked you to recite the water fall</p><p>Who asked you to recite the water fall</p><p>Who asked you to recite the water fall</p><p>Who asked you to recite the water fall</p><p>Who asked you to recite the water fall</p><p>Who asked you to recite the water fall</p><p>Who asked you to recite the water fall</p><p>Who asked you to recite the water fall</p><p>Who asked you to recite the water fall</p><p>Who asked you to recite the water fall</p><p>Who asked you to recite the water fall</p> <p>Who asked you to recite the water fall<p>Who asked you to recite the water fall</p><p>Who asked you to recite the water fall</p> <script type="text/javascript" src="demo.js"></script> <p>Who asked you to recite the water fall</p> <p>Who asked you to recite the water fall</p> <p>Who asked you to recite the water fall</p> <p>Who asked you to recite the water fall</p> <p>Who asked you to recite the water fall</p> <p>Who asked you to recite the water fall</p> <p>Who asked you to recite the water fall</p></div><p>File information</p></body></html>
demo.js:
document.writeln("<div id=/"contSonOnly/">");document.writeln("<p>Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content.");document.writeln("</div>");window.onload=function(){ var contSonOnly=document.getElementById("contSonOnly"); var contParent=contSonOnly.parentNode; var contSonList=contParent.children; for(var i=0;i<contSonList.length;i++){ if(contSonList[i]!=contSonOnly){ contSonList[i].style.display="none"; } }}The renderings are as follows:
For more information about JavaScript related content, please check out the topics of this site: "Summary of JavaScript Traversal Algorithm and Skills", "Summary of JavaScript Switching Special Effects and Skills", "Summary of JavaScript Search Algorithm Skills", "Summary of JavaScript Animation Special Effects and Skills", "Summary of JavaScript Errors and Debugging Skills", "Summary of JavaScript Data Structures and Algorithm Skills" and "Summary of JavaScript Mathematical Operation Usage"
I hope this article will be helpful to everyone's JavaScript programming.