table-of-content - npm Package Compare versions

Comparing version 1.0.3 to 1.0.4

index.js

 function initTableOfContents() {
+  // Tìm phần tử để chèn TOC
+  let index = document.getElementById('index');
+  if (!index) {
+    index = document.createElement('div');
+    index.id = 'index';
+    index.className = 'max-w-3xl mx-auto';
+    document.body.appendChild(index);
+  }
 
-	let index = document.getElementById('index');
-	if (!index) {
-		index = document.createElement('div');
-		index.id = 'index';
-		index.className = 'max-w-3xl mx-auto';
-		document.body.appendChild(index);
-	}
+  // Hàm tạo TOC
+  function generateTOC() {
+    const headings = document.querySelectorAll('h2, h3, h4');
+    const tocList = document.createElement('ul');
+    let currentParent = null;
 
-	const headings = document.querySelectorAll('h2, h3, h4');
+    headings.forEach((heading) => {
+      if (!heading.id) {
+        // Tự động thêm id nếu thiếu
+        heading.id = heading.textContent
+          .toLowerCase()
+          .replace(/\s+/g, '-')
+          .replace(/[^a-z0-9-]/g, '');
+      }
 
-	const tocList = document.createElement('ul');
-	let currentParent = null;
+      const listItem = document.createElement('li');
+      const anchor = document.createElement('a');
+      anchor.href = `#${heading.id}`;
+      anchor.textContent = heading.textContent;
+      listItem.appendChild(anchor);
 
-	headings.forEach((heading) => {
-		const listItem = document.createElement('li');
-		const anchor = document.createElement('a');
-		anchor.href = `#${heading.id}`;
-		anchor.textContent = heading.textContent;
-		listItem.appendChild(anchor);
+      switch (heading.tagName.toLowerCase()) {
+        case 'h2':
+          break;
+        case 'h3':
+          listItem.style.fontStyle = 'italic';
+          break;
+        case 'h4':
+          break;
+      }
 
-		switch (heading.tagName.toLowerCase()) {
-			case 'h2':
-				break;
-			case 'h3':
-				listItem.style.fontStyle = 'italic';
-				break;
-			case 'h4':
-				break;
-		}
+      if (heading.tagName.toLowerCase() === 'h3' || heading.tagName.toLowerCase() === 'h4') {
+        if (currentParent) {
+          const subList = currentParent.querySelector('ul') || document.createElement('ul');
+          subList.appendChild(listItem);
+          currentParent.appendChild(subList);
+        }
+      } else {
+        tocList.appendChild(listItem);
+        currentParent = listItem;
+      }
+    });
 
-		if (heading.tagName.toLowerCase() === 'h3' || heading.tagName.toLowerCase() === 'h4') {
-			if (currentParent) {
-				const subList = currentParent.querySelector('ul') || document.createElement('ul');
-				subList.appendChild(listItem);
-				currentParent.appendChild(subList);
-			}
-		} else {
-			tocList.appendChild(listItem);
-			currentParent = listItem;
-		}
-	});
+    if (tocList.children.length > 0) {
+      index.appendChild(tocList);
+      hideLastTOCItems(tocList, 20);
+    } else {
+      console.warn('Không có tiêu đề nào được thêm vào TOC');
+    }
+  }
 
-	index.appendChild(tocList);
+  function hideLastTOCItems(tocList, count) {
+    const items = tocList.querySelectorAll('li');
+    const totalItems = items.length;
+    const itemsToHide = Math.min(count, totalItems);
 
-	hideLastTOCItems(tocList, 20);
+    for (let i = totalItems - itemsToHide; i < totalItems; i++) {
+      items[i].style.display = 'none';
+    }
+  }
 
-	function hideLastTOCItems(tocList, count) {
-		const items = tocList.querySelectorAll('li');
-		const totalItems = items.length;
+  // Chạy sau khi DOM sẵn sàng
+  if (document.readyState === 'complete' || document.readyState === 'interactive') {
+    generateTOC();
+  } else {
+    document.addEventListener('DOMContentLoaded', generateTOC);
+  }
 
-		const itemsToHide = Math.min(count, totalItems);
+  // Hàm dọn dẹp
+  function destroy() {
+    if (index && index.parentNode) {
+      index.parentNode.removeChild(index);
+    }
+  }
 
-		for (let i = totalItems - itemsToHide; i < totalItems; i++) {
-			items[i].style.display = 'none';
-		}
-	}
-
-	function destroy() {
-		if (index && index.parentNode) {
-			index.parentNode.removeChild(index);
-		}
-	}
-
-	return { destroy };
+  return { destroy };
 }
 
-window.onload = () => {
-	initTableOfContents();
-};
+// Xuất hàm để gọi thủ công nếu cần
+module.exports = { initTableOfContents };
 
-module.exports = { initTableOfContents };
+// Tự động chạy khi script được tải
+initTableOfContents();

package.json

 {
 	"name": "table-of-content",
-	"version": "1.0.3",
+	"version": "1.0.4",
 	"description": "Table of Contents Generator is a JavaScript package that creates a floating table of contents (TOC) button and panel for web pages.",
@@ -5,0 +5,0 @@ "main": "index.js",

No alert changes

Improved metrics

Total package byte prevSize

21865

4.53%

Lines of code

79

38.6%

No dependency changes