// İçindekiler kutusu için div oluşturalım
var contentsDiv = document.createElement("div");
contentsDiv.id = "contents";
contentsDiv.style.backgroundColor = "#f8f9fa"; // Arka plan rengini ayarlayalım
contentsDiv.style.border = "1px solid lightgray";
var boldTitle = document.createElement("b"); // Kalın başlık oluşturalım
boldTitle.innerHTML = "İçindekiler<br/>";
contentsDiv.appendChild(boldTitle); // Kalın başlığı içindekilere ekleyelim
// Content içerisindeki h etiketlerini bulalım
var contentDiv = document.getElementById("Content100");
var hTags = contentDiv.querySelectorAll("h2, h3, h4, h5, h6");
// İçindekiler kutusunu oluşturalım
var ul = document.createElement("ul");
ul.style.display = "inline";
hTags.forEach(function(tag) {
// Her h etiketi için bir liste öğesi (li) oluşturalım
var li = document.createElement("li");
// Boşluk ekleyelim
var indentation = " ".repeat(parseInt(tag.tagName.substring(1)) - 2);
// Bağlantı oluşturalım ve içeriği ekleyelim
var link = document.createElement("a");
link.innerHTML = indentation + tag.textContent;
link.href = "#" + tag.id;
// Listeye bağlantıyı ekleyelim
li.appendChild(link);
// Liste öğesini içindekiler kutusuna ekleyelim
ul.appendChild(li);
});
// Gizle/Göster butonunu oluşturalım
var toggleButton = document.createElement("button");
toggleButton.textContent = "Gizle";
toggleButton.onclick = function() {
var contents = document.getElementById("contents");
var ul = contents.querySelector("ul");
if (ul.style.display !== "none") {
ul.style.display = "none";
toggleButton.textContent = "Göster";
} else {
ul.style.display = "inline";
toggleButton.textContent = "Gizle";
}
};
// Butonu içindekiler kutusunun altına ekleyelim
contentsDiv.appendChild(toggleButton);
// İçindekiler kutusunu tamamlayalım ve content div içerisine ekleyelim
contentsDiv.appendChild(ul);
contentDiv.insertBefore(contentsDiv, contentDiv.firstChild);
document.getElementById("contents").style.display = "inline-block";
if (hTags.length < 1) {document.getElementById("contents").style.display = "none";}