树视图元素是一种下拉菜单,但组织得很好。这种视图为您的网站提供了一个有组织的外观,我们可以使用 HTML、CSS 和 JavaScript 创建一个下拉列表的树视图架构。我们将整个过程分为创建结构和设计结构两部分。下面分别对这两部分进行阐述。
创建结构:在本节中,我们将在元素的树视图架构中创建目录的基本结构。
- HTML代码:
Create a Table of Content in Tree View Architecture using HTML, CSS and JavaScript GeeksforGeeks
A Computer Science Portal for Geeks
- Tutorials
- Algorithms
-
Analysis of Algorithms
- Asymptotic Analysis
- Worst, Average and Best Cases
- Asymptotic Notations
- Little o and little omega notations
- Lower and Upper Bound Theory
- Analysis of Loops
- Solving Recurrences
- Amortized Analysis
- What does ‘Space Complexity’ mean?
- Pseudo-polynomial Algorithms
- Polynomial Time Approximation Scheme
- A Time Complexity Question
- Searching Algorithms
- Sorting Algorithms
- Graph Algorithms
- Pattern Searching
- Geometric Algorithms
- Mathematical
- Randomized Algorithms
- Greedy Algorithms
- Dynamic Programming
- Divide and Conquer
- Backtracking
- Branch and Bound
- All Algorithms
-
Analysis of Algorithms
-
Data Structures - Arrays
- Linked List
- Stack
- Queue
- Binary Tree
- Binary Search Tree
- Heap
- Hashing
- Graph
- Advanced Data Structure
- Matrix
- Strings
- All Data Structures
-
Languages - C
- C++
- Java
- Python
- C#
- Javascript
- JQuery
- SQL
- PHP
- Scala
- Perl
- Go Language
- HTML
- CSS
- Kotlin
-
Interview Corner
- Company Preparation
- Top Topics
- Practice Company Questions
- Interview Experiences
- Experienced Interviews
- Internship Interviews
- Competitive Programming
- Design Patterns
- Multiple Choice Quizzes
-
GATE -
ISRO CS -
UGC NET CS -
CS Subjects - < class="gfg">Web Technologies
- Algorithms
- Tutorials
设计结构:在上一节中,我们已经创建了基本树视图元素的结构。在本节中,我们将设计树视图的结构。
- CSS代码:
- JavaScript 代码:
组合 HTML、CSS 和 JavaScript 代码:这是组合上述部分后的最终代码。它将在树视图架构中显示目录。
Create a Table of Content in Tree
View Architecture using HTML, CSS
and JavaScript
GeeksforGeeks
A Computer Science Portal for Geeks
- Tutorials
- Algorithms
-
Analysis of Algorithms
- Asymptotic Analysis
- Worst, Average and Best Cases
- Asymptotic Notations
- Little o and little omega notations
- Lower and Upper Bound Theory
- Analysis of Loops
- Solving Recurrences
- Amortized Analysis
- What does ‘Space Complexity’ mean?
- Pseudo-polynomial Algorithms
- Polynomial Time Approximation Scheme
- A Time Complexity Question
- Searching Algorithms
- Sorting Algorithms
- Graph Algorithms
- Pattern Searching
- Geometric Algorithms
- Mathematical
- Randomized Algorithms
- Greedy Algorithms
- Dynamic Programming
- Divide and Conquer
- Backtracking
- Branch and Bound
- All Algorithms
-
Data Structures
- Arrays
- Linked List
- Stack
- Queue
- Binary Tree
- Binary Search Tree
- Heap
- Hashing
- Graph
- Advanced Data Structure
- Matrix
- Strings
- All Data Structures
-
Languages
- C
- C++
- Java
- Python
- C#
- Javascript
- JQuery
- SQL
- PHP
- Scala
- Perl
- Go Language
- HTML
- CSS
- Kotlin
-
Interview Corner
- Company Preparation
- Top Topics
- Practice Company Questions
- Interview Experiences
- Experienced Interviews
- Internship Interviews
- Competitive Programming
- Design Patterns
- Multiple Choice Quizzes
GATE
ISRO CS
UGC NET CS
CS Subjects
Web Technologies
输出: