HTMLウィンドウの長さプロパティ HTMLウィンドウの長さプロパティは、現在のHTMLドキュメント内の要素の数を返します。</P> <h2>構文</h2> <p> 以下は構文です-</P> <pre>window.length</pre> <p> HTMLウィンドウの長さプロパティの例を見てみましょう-</P> <h2>例</h2> <pre><!DOCTYPE html> <html> <style> body { color: #000; height: 100vh; background-color: #8BC6EC; background-image: linear-gradient(135deg, #8BC6EC 0%, #9599E2 100%); text-align: center; } .btn { background: #db133a; border: none; height: 2rem; border-radius: 2px; width: 40%; display: block; color: #fff; outline: none; cursor: pointer; margin: 1rem auto; } </style> <body> <h1>HTML Window length Property</h1> <iframe src="https://tutorialspoint.com/"></iframe> <button onclick="display()" class="btn">Show the number of iframe</button> <div class="show"></div> <script> function display() { document.querySelector('.show').innerHTML = 'Number of iframe is: ' + window.length; } </script> </body> </html></pre> <h2>出力</h2> <p> <img loading='lazy' alt='HTMLウィンドウの長さプロパティ ' src="/article/uploadfiles/202203/2022033116465812.jpg" /> </P> <p> 「iframeの数を表示」ボタンをクリックして、HTMLドキュメントのiframeの数を表示します-</P> <p> <img loading='lazy' alt='HTMLウィンドウの長さプロパティ ' src="/article/uploadfiles/202203/2022033116465903.jpg" /> </P> <br> </div> <div class="ad5"><script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-4480737146802772" crossorigin="anonymous"></script> <!-- jp.wsxdn 2 --> <ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-4480737146802772" data-ad-slot="2397329591" data-ad-format="auto" data-full-width-responsive="true"></ins> <script> adsbygoogle = window.adsbygoogle || [].push{}; </script></div> <div id="turn-page" class="f-between"> <div class="page up f-align"> <i class="prev"></i> <a class='LinkPrevArticle' href='https://jp.wsxdn.com/pn014i/ay151t/1001065231.html' >HTMLDOMスタイルのpageBreakInsideプロパティ </a> </div> <div class="page down f-align"> <a class='LinkNextArticle' href='https://jp.wsxdn.com/pn014i/ay151t/1001065233.html' >HTML5数学演算子 </a> <i class="next"></i> </div> </div> <section class="bottom-list"> <ol> <li class="f-between"> <div> <a href="https://jp.wsxdn.com/pn014i/ay151t/1001065425.html" class="t-over" title="HTMLDOMウィンドウフレームプロパティ "> <span>HTMLDOMウィンドウフレームプロパティ </span> </a> <p class="r-over r-over-3"> HTML DOMウィンドウフレームプロパティは、ウィンドウに対応するオブジェクトを返し、ウィンドウに存在するすべてのフレームを表します。 構文 以下は構文です- 現在のウィンドウでフレームを返す window.frames HTMLDOMウィンドウフレームの例を見てみましょう。 プロパティ- 例 <!DOCTYPE html><html> <head> <title>HTML DOM Window frames</title> <style> * { </p> </div> </li> <li class="f-between"> <div> <a href="https://jp.wsxdn.com/pn014i/ay151t/1001065426.html" class="t-over" title="HTMLDOMウィンドウのframeElementプロパティ "> <span>HTMLDOMウィンドウのframeElementプロパティ </span> </a> <p class="r-over r-over-3"> HTML DOMウィンドウのframeElementプロパティは、、、などの埋め込みウィンドウに対応するHTML要素を返します。 構文 以下は構文です- ウィンドウ埋め込み要素を返す window.frameElement 例 HTMLDOMウィンドウのframeElementプロパティの例を見てみましょう- <!DOCTYPE html> <html> <head> <title>HTML DOM Window frameElement</title> <style> * {   </p> </div> </li> </ol> </section> </article> <aside class="box1-r box4-r"> <section class="small-nav"> <ul class="f-between"> <li><a class='childclass' href='https://jp.wsxdn.com/pn014i/gd144y/' target="_self">Cプログラミング</a></li> <li><a class='childclass' href='https://jp.wsxdn.com/pn014i/qo145i/' target="_self">C ++</a></li> <li><a class='childclass' href='https://jp.wsxdn.com/pn014i/jh146b/' target="_self">Redis</a></li> <li><a class='childclass' href='https://jp.wsxdn.com/pn014i/hf147z/' target="_self">BASHプログラミング</a></li> <li><a class='childclass' href='https://jp.wsxdn.com/pn014i/mk148e/' target="_self">Python</a></li> <li><a class='childclass' href='https://jp.wsxdn.com/pn014i/lj149d/' target="_self">Java</a></li> <li><a class='childclass' href='https://jp.wsxdn.com/pn014i/ay150s/' target="_self">データベース</a></li> <li><a class='childclass' href='https://jp.wsxdn.com/pn014i/ay151t/' target="_self">HTML</a></li> <li><a class='childclass' href='https://jp.wsxdn.com/pn014i/pn152h/' target="_self">Javascript</a></li> <li><a class='childclass' href='https://jp.wsxdn.com/pn014i/jh153b/' target="_self">プログラミング</a></li> <li><a class='childclass' href='https://jp.wsxdn.com/pn014i/if154a/' target="_self">CSS</a></li> <li><a class='childclass' href='https://jp.wsxdn.com/pn014i/ig155a/' target="_self">Ruby</a></li> <li><a class='childclass' href='https://jp.wsxdn.com/pn014i/jg156b/' target="_self">SQL</a></li> <li><a class='childclass' href='https://jp.wsxdn.com/pn014i/ig157b/' target="_self">IOS</a></li> <li><a class='childclass' href='https://jp.wsxdn.com/pn014i/wu158p/' target="_self">Android</a></li> <li><a class='childclass' href='https://jp.wsxdn.com/pn014i/ge159z/' target="_self">MongoDB</a></li> <li><a class='childclass' href='https://jp.wsxdn.com/pn014i/jh160b/' target="_self">MySQL</a></li> <li><a class='childclass' href='https://jp.wsxdn.com/pn014i/ec161w/' target="_self">C＃</a></li> <li><a class='childclass' href='https://jp.wsxdn.com/pn014i/gd165y/' target="_self">PHP</a></li> <li><a class='childclass' href='https://jp.wsxdn.com/pn014i/ig171a/' target="_self">SQL Server</a></li> </ul> </section> <div class="box1-r-list"> <div> <i></i> <span>HTML</span> </div> <ol> <li class="f-start"> <em></em> <a href="https://jp.wsxdn.com/pn014i/ay151t/1001064436.html" class="r-over r-over-2" title="HTMLDOM履歴の長さプロパティ ">HTMLDOM履歴の長さプロパティ </a> </li> <li class="f-start"> <em></em> <a href="https://jp.wsxdn.com/pn014i/ay151t/1001064485.html" class="r-over r-over-2" title="HTML DOMSelectlengthプロパティ ">HTML DOMSelectlengthプロパティ </a> </li> <li class="f-start"> <em></em> <a href="https://jp.wsxdn.com/pn014i/ay151t/1001064909.html" class="r-over r-over-2" title="HTMLDOMフォームの長さプロパティ ">HTMLDOMフォームの長さプロパティ </a> </li> <li class="f-start"> <em></em> <a href="https://jp.wsxdn.com/pn014i/ay151t/1001064956.html" class="r-over r-over-2" title="HTMLDOMストレージの長さプロパティ ">HTMLDOMストレージの長さプロパティ </a> </li> <li class="f-start"> <em></em> <a href="https://jp.wsxdn.com/pn014i/ay151t/1001065000.html" class="r-over r-over-2" title="HTMLDOMdefaultViewプロパティ ">HTMLDOMdefaultViewプロパティ </a> </li> <li class="f-start"> <em></em> <a href="https://jp.wsxdn.com/pn014i/ay151t/1001065241.html" class="r-over r-over-2" title="HTMLウィンドウのpageXOffsetプロパティ ">HTMLウィンドウのpageXOffsetプロパティ </a> </li> <li class="f-start"> <em></em> <a href="https://jp.wsxdn.com/pn014i/ay151t/1001065242.html" class="r-over r-over-2" title="HTMLウィンドウscreenYプロパティ ">HTMLウィンドウscreenYプロパティ </a> </li> <li class="f-start"> <em></em> <a href="https://jp.wsxdn.com/pn014i/ay151t/1001065243.html" class="r-over r-over-2" title="HTMLウィンドウscreenXプロパティ ">HTMLウィンドウscreenXプロパティ </a> </li> <li class="f-start"> <em></em> <a href="https://jp.wsxdn.com/pn014i/ay151t/1001065244.html" class="r-over r-over-2" title="HTMLウィンドウscreenTopプロパティ ">HTMLウィンドウscreenTopプロパティ </a> </li> <li class="f-start"> <em></em> <a href="https://jp.wsxdn.com/pn014i/ay151t/1001065245.html" class="r-over r-over-2" title="HTMLウィンドウscreenLeftプロパティ ">HTMLウィンドウscreenLeftプロパティ </a> </li> </ol> </div> </aside> </section> <footer> <section> <span class="container f-center"> 著作権 © <a href="https://jp.wsxdn.com">https://jp.wsxdn.com</a> 全著作権所有 </span> </section> </footer> </body> </html>
