Bagaimana untuk menyasarkan bingkai tertentu melalui hiperpautan dalam JavaScript?-tutorial js-php.cn

Bagaimana untuk menyasarkan bingkai tertentu melalui hiperpautan dalam JavaScript?

WBOY

Lepaskan： 2023-09-08 14:01:09

ke hadapan

853 orang telah melayarinya

如何在 JavaScript 中通过超链接定位特定框架？

Bingkai HTML menyediakan cara yang mudah untuk membahagikan tetingkap penyemak imbas kepada beberapa bahagian.

Setiap bahagian ini boleh memuatkan dokumen HTML yang berasingan. Kami boleh menggunakan JavaScript untuk memuatkan kandungan ke dalam bingkai tertentu, menggunakan sifat bingkai objek tetingkap. Sifat Frames ialah objek seperti tatasusunan yang mengandungi semua bingkai (termasuk iframe) pada halaman semasa.

Kami boleh memuatkan kandungan dokumen ke dalam bingkai menggunakan harta window.frames[] dalam pelbagai cara. Mari lihat satu persatu -

1. Menggunakan indeks

Untuk menyasarkan bingkai tertentu, anda boleh menggunakan indeks atau nama bingkai tersebut. Contohnya, untuk menyasarkan bingkai pertama pada halaman, anda boleh menggunakan kod berikut -

window.frames[0].document.location.href = "http://www.example.com"

Salin selepas log masuk

2. Gunakan nama bingkai

Untuk mencari bingkai menggunakan namanya, anda boleh menggunakan kaedah berikut. Andaikan nama bingkai ialah "frame_name" -

window.frames["frame_name"].document.location.href = "http://www.example.com";

Salin selepas log masuk

3. Gunakan getElementById dan getElementByName

Anda juga boleh mencari bingkai menggunakan kaedah getElementById() atau getElementsByName() dan kemudian mengakses tetingkap bingkai menggunakan kaedah contentWindow seperti yang ditunjukkan di bawah -

document.getElementById("frame_id").contentWindow.location.href = "http://www.example.com";
document.getElementsByName("frame_name")[0].contentWindow.location.href = "http://www.example.com";

Salin selepas log masuk

Contoh

Berikut ialah coretan kod kerja lengkap dengan semua kaedah ini -

<!DOCTYPE html>
<html>
<head>
   <title>Target a frame</title>
</head>
<body>
   <button onclick="indexMethod()">Using Index</button>
   <button onclick="nameMethod()">Using Frame Name</button>
   <button onclick="queryMethod()">Using Query Methods</button>
   <iframe src=""
      height="150px"
      width="100%"
      name="frame_name"
      id="frame_id" srcdoc="<html>
         <body style='background-color:#ccc;'>
         <h1>Testing iframe</h1>
         </body>
         </html>">
   </iframe>
   </body>
   <script>
      const indexMethod = () => {
         const child = document.createElement('p');
         child.innerText = 'added inside frame';
         window.frames[0].document.body.appendChild(child);
     };
      const nameMethod = () => {
         const child = document.createElement('p');
         child.innerText = 'added inside frame';
         window.frames["frame_name"].document.body.appendChild(child);
     };
     const queryMethod = () => {
         const child = document.createElement('p');
         child.innerText = 'added inside frame';
         document.getElementById("frame_id").contentWindow.document.body.appendChild(child);
     };
   </script>
</html>

Salin selepas log masuk

Atas ialah kandungan terperinci Bagaimana untuk menyasarkan bingkai tertentu melalui hiperpautan dalam JavaScript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!