如何使用 JavaScript 将标题转换为 URL Slug？

给定一个标题，任务是使用 JavaScript 将标题转换为 URL slug。在本文中，我们将使用 HTML 来设计 body 的基本结构，使用 CSS 设置 body 的样式，使用 JavaScript 来实现逻辑结构。

先决条件：

HTML 基础
JavaScript 基础

基本上下面的程序将使用 JavaScript 将标题转换为 URL Slug。

方法：

创建一个 HTML 表单，其中输入标题并输出具有唯一 ID 的 URL slug。
向元素添加一些 CSS 样式。

下面是基本的 HTML 代码实现：

HTML



  

    

  

    
        
            GeeksforGeeks
  
            Input Title: 
            
  
            URL Slug: 
            
  
            
  
  
            
                
                    Generated URL Slug
                :

Javascript

HTML



  

    

  

    
        
            GeeksforGeeks
  
            Input Title: 
            
  
            URL Slug: 
            
  
            
  
  
            
                Generated URL Slug:

在这里，我们使用了 JavaScript 中的replace()函数来制作字符串slug。
创建的 slug字符串可以进一步用于 URL。

下面是 JavaScript 代码实现：

Javascript

示例：在本示例中，我们将结合以上两段代码（HTML 和 JavaScript 代码）将标题转换为 URL slug。

HTML



  

    

  

    
        
            GeeksforGeeks
  
            Input Title: 
            
  
            URL Slug: 
            
  
            
  
  
            
                Generated URL Slug:

输出：