GithubHelp home page GithubHelp logo

parseurl.js's Introduction

parseURL.js

npm version Gzip size prettier code style Coverage npm downloads MIT License

parseURL.js - 专门解析 URL 地址信息的 JavaScript 工具。

项目初衷

编写 parseURL.js 主要是为初学 JavaScript 的朋友了解在 JavaScript 中 如何使用 JavaScript 解析 URL?而开发的。当然,parseURL.js 也完全可以胜任在实际产品开发的应用。

Features

  • 原生 JavaScript 编写,无任何依赖;
  • 支持 UMD 模块规范,同时也提供 ES6 模块调用;
  • 解析的 URL 地址信息非常全面:
    1. href - 完整 URL 地址
    2. origin - 原始输入
    3. protocol - 协议
    4. username - 用户名
    5. password - 密码
    6. host - 域名地址
    7. hostname - 域名名称
    8. port - 端口号
    9. path - 路径
    10. pathname - 路径名
    11. search - 查询参数
    12. searchParams
    13. hash - 哈希值
  • 文件体积小(GZip:1KB),加载速度快;

Browsers support

IE / Edge
IE / Edge
Firefox
Firefox
Chrome
Chrome
Safari
Safari
Opera
Opera
IE11, Edge last 10 versions last 10 versions last 10 versions last 10 versions

Install

parseURL.js 支持 AMD 和 CommonJS 规范的模块调用方式,可以直接使用 npm 安装,也可以使用 script 标签引入到页面。

npm install

npm i -S @yaohaixiao/parseurl.js

script

可以根据项目的实际情况,选择调用 CDN 文件或者本地文件。

CDN

<script src="https://cdn.jsdelivr.net/gh/yaohaixiao/parseurl.js/parseURL.min.js"></script>

Local

<script src="path/to/parseURL.min.js"></script>

Usage

parseURL.js 支持 UMD 模块规范,也支持作为 ES6 模块使用。

作为 CommonJS 模块使用

// Node.js 环境中使用
const parseURL = require('@yaohaixiao/parseurl.js')

// 使用绝对路径
const url = parseURL('https://github.com/yaohaixiao/parseurl.js?id=23')

// 获取查询字符串中 id 的值,如果没有则返回空
url.searchParams.get('id') // -> '23'

作为 ES6 模块使用

// 作为 ES6 模块使用
import parseURL from '@yaohaixiao/parseurl.js/parseURL'

// 使用基础路径
const url = parseURL('/yaohaixiao/parseurl.js?age=24', 'https://github.com')

// 获取查询字符串中 age 的值,如果没有则返回空
url.searchParams.get('age') // -> '24'

API Documentation

parseURL.js 提供了一个核心方法 parseURL().

parseURL(url[, base])

Parameters

url

Type: String

Default: ``

(必须)表示绝对或相对 URL 的字符串。如果 url 是相对 URL,则会将 base 用作基准 URL。如果 url 是绝对URL,则无论参数base是否存在,都将被忽略;

base

Type: String

Default: ``

(必须)表示基准 URL 的字符串。在 url 是相对 URL 时,它才会起效。如果未指定,则默认为 ”;

Returns

Type: Object

返回解析 URL 地址信息后的(JSON)对象:

const url = parseURL('https://yaohaixiao:[email protected]:8080/yaohaixiao/parseurl.js?col=24&row=23#top')
// ->
// {
//   href: "https://yaohaixiao:[email protected]:8080/yaohaixiao/parseurl.js?col=24&row=23#top",
//   origin:
//   "https://github.com:8080",
//   protocol: "https:",
//   username: "yaohaixiao",
//   password: "parseUrl.js",
//   hostname: "github.com",
//   port: "8080",
//   host: "github.com:8080",
//   pathname: "/yaohaixiao/parseurl.js",
//   search: "?col=24&row=23",
//   searchParams: {
//     get(prop) {
//      // ... 获取 search 数据的方法
//     }
//   },
//   path: "/yaohaixiao/parseurl.js?col=24&row=23",
//   hash: "#top"
//  }

License

Licensed under MIT License.

parseurl.js's People

Contributors

yaohaixiao avatar

Stargazers

西东 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.