Saya punya pertanyaan dan saya ingin tahu apakah itu mungkin. Saya ingin menambahkan konten secara dinamis ke halaman html, dengan mengubah id di URL.

Maksud saya, misalnya saya ingin menambahkan nama seseorang ke halaman web:

Pada awalnya halaman saya adalah : www.mypage.com/index

<p> Hello <span></span> welcome to our page</p> 

Hasil yang ingin saya dapatkan, adalah dengan menulis url ini: www.mypage.com/index#YourName kode memperbarui dirinya menjadi ini:

<p> Hello <span id="YourName">YourName</span> welcome to our page</p> 

Jadi id dan konten rentang diperbarui hanya dengan memodifikasi URL. Saya tidak benar-benar tahu bagaimana mencapai itu. Saya ingin tahu apakah saya dapat memberikan id pada rentang saya secara dinamis dengan mengetiknya di url, dan kemudian mengambil id ini dan menggunakannya sebagai nilai rentang.

0
mscmdaddcts 17 Januari 2021, 01:02

3 jawaban

Jawaban Terbaik

Anda bisa mendapatkan nilai ID dari url dengan menggunakan window.location.hash.

Selain itu, Anda dapat melihat perubahan ini dengan menggunakan peristiwa jendela hashchange.

function showHash() {
  const newHash = window.location.hash.replace("#", "");
  const resultSpan = document.querySelector(".hash-value");
  
  resultSpan.id = newHash;
  resultSpan.innerHTML = newHash;
}

window.addEventListener("hashchange", showHash, false);
window.addEventListener("DOMContentLoaded", showHash);
<body>

  <div>Current HASH in URL is: <span class="hash-value"></span></div>

  <div class="buttons">
    <a href="#hash1">hash1</a>
    <a href="#hash2">hash2</a>
    <a href="#hash3">hash3</a>
  </div>
</body>
1
Alexandru Bulat 16 Januari 2021, 23:55

Anda dapat menggunakan JavaScript untuk mendapatkan tautan saat ini seperti:

<script>
   let YourLink = window.location.href;
   let startingPoint = YourLink.indexOf('#');
   let endingPoint = YourLink.indexOf('/'); // In case if the name is not the last thing on your link
   let NameYouWant = YourLink.substring(startingPoint, endingPoint);

   // So 'NameYouWant' would be the name you need to use
</script>

Jika Anda menggunakan '#' untuk titik awal setiap nama di tautan Anda, semoga bermanfaat.

0
hayate 16 Januari 2021, 22:31

Mungkin Anda bisa mencoba ini

let splits = window.location.href.split("#");
let span = document.getElementsByTagName("p")[0].getElementsByTagName("span")[0];
span.innerText = splits[splits.length - 1];
span.id = splits[splits.length - 1];
0
dm_tr 16 Januari 2021, 22:49