# jjychengtoolsbox

**Repository Path**: jjycheng/jjychengtoolsbox

## Basic Information

- **Project Name**: jjychengtoolsbox
- **Description**: js常用工具jjychengtoolsbox；获取URL参数,获取Cookie,设置Cookie, 时间万能转换-兼容IE,截取字符串,过滤全部html,生成随机数,检查是否手机端访问
- **Primary Language**: JavaScript
- **License**: Apache-2.0
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2024-03-11
- **Last Updated**: 2024-03-11

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# jjychengtoolsbox

## 介绍
"获取URL参数",
"获取Cookie",
"设置Cookie",
"时间万能转换-兼容IE",
"截取字符串",
"过滤全部html",
"生成随机数",
"检查是否手机端访问"

## 作者
 "author": "JJY.Cheng"，

 "blogUrl":https://cplvfx.blog.csdn.net/"
 
 "NPM项目地址"：https://www.npmjs.com/package/jjychengtoolsbox?activeTab=readme

 ## 使用演示

### 安装
 ``` bash
 npm i jjychengtoolsbox
 ```
### 引入
``` js
import jjychengtoolsbox from 'jjychengtoolsbox';
```
### 使用
#### 根据名称获取URL参数
``` js
jjychengtoolsbox.GetQueryStringFun('参数名称')
```
#### 获取Cookie
``` js
jjychengtoolsbox.getCookieFun('名称')
```
#### 设置Cookie
``` js
jjychengtoolsbox.setCookieFun('名称')
```
#### 时间万能转换-兼容IE
``` js
jjychengtoolsbox.DateTimeConvertFun('时间字符串','格式')
// 格式如下：
// 'yyyy/mm/dd hh:mm'
// 'yyyy/mm/dd'
// 'yyyy-mm-dd hh:mm'
// 'yyyy-mm-dd'
// 'yyyy年mm月dd日' 
```
#### 截取字符串
``` js
jjychengtoolsbox.SliceTxtFun('字符串','截取长度（数字）')
```
#### 过滤全部html标签
``` js
jjychengtoolsbox.FilterHtmlFun('字符串')
```
#### 生成随机数
``` js
jjychengtoolsbox.RandomNumberFun('起始数字','结束数字')
```
#### 检查是否手机端访问
``` js
jjychengtoolsbox.IsMobileFun()
//如果是手机访问，返回true,否则false
```

### 完整演示
####  js
``` js
import jjychengtoolsbox from 'jjychengtoolsbox';
export default {
  name: 'App',
  components: {
    HelloWorld
  },
  data(){
    return { 
      jjyT:{},
      FilterHtml:'',
    }
  },
  created(){
    this.jjyT=jjychengtoolsbox;
    console.log(this.txt)
    console.log(jjychengtoolsbox)
    
    this.jjyT.setCookieFun('jjyT','jjychengtoolsbox',1);//设置Cookie
    this.FilterHtml=this.jjyT.FilterHtmlFun('<b>1.我是粗体;</b><i>2.我是斜体;</i><a href="#">3.我是超链接;</a>');//过滤html
  }
}
```
#### html
```html
    <div class="jjyChengUI-tableBox">
    <table border="1" style="margin:0 auto;">

      <tr>
        <td>名称</td>
        <td>描述</td>
        <td>例子</td>
      </tr>

      <tr>
        <td class="txt-l">GetQueryStringFun<br/>根据名称获取URL参数</td>
        <td class="txt-l">
          <p>如url:http://localhost:8081/?id=1</p>
          <p>我想拿到id的值</p>
        </td>
        <td class="txt-l">
          id={{jjyT.GetQueryStringFun('id')}}
        </td>
      </tr>

      <tr>
        <td class="txt-l">getCookieFun<br/>获取Cookie</td>
        <td class="txt-l">
          <p>如：</p>
          <p>jjyT.setCookieFun('jjyT','jjychengtoolsbox',1)</p>
        </td>
        <td class="txt-l">
          {{jjyT.getCookieFun('jjyT')}}
        </td>
      </tr>

      <tr>
        <td class="txt-l">DateTimeConvertFun<br/>时间万能转换-兼容IE</td>
        <td class="txt-l">
          如：<br/>
          时间戳:1709977671<br/>
          时间字符串：2024-3-9 17:47:51<br/>
        </td>
        <td class="txt-l">
          时间戳:{{jjyT.DateTimeConvertFun('1709977793','yyyy年mm月dd日')}}<br/>
          时间字符串：{{jjyT.DateTimeConvertFun('2024-3-9 17:47:51','yyyy年mm月dd日')}}<br/>
        </td>
      </tr>

      <tr>
        <td class="txt-l">SliceTxtFun<br/>截取字符串</td>
        <td class="txt-l">
          如：<br/>
          截取字符串123456
        </td>
        <td class="txt-l">
          {{jjyT.SliceTxtFun('截取字符串123456',5)}}
        </td>
      </tr>

      <tr>
        <td class="txt-l">FilterHtmlFun<br/>过滤全部html</td>
        <td class="txt-l">
          如：<br/> 
            <b>1.我是粗体;</b><i>2.我是斜体;</i><a href="#">3.我是超链接;</a> 
        </td>
        <td class="txt-l">
          {{FilterHtml}}
        </td>
      </tr>

      <tr>
        <td class="txt-l">RandomNumberFun<br/>生成随机数</td>
        <td class="txt-l">
          如：1-5
        </td>
        <td class="txt-l">
          {{jjyT.RandomNumberFun(1,5)}}
        </td>
      </tr>

      <tr>
        <td class="txt-l">IsMobileFun<br/>检查是否手机端访问</td>
        <td class="txt-l">
          如：1-5
        </td>
        <td class="txt-l">
          {{jjyT.IsMobileFun()}}
        </td>
      </tr>


    </table>
  </div>
```
#### css
```css
.jjyChengUI-tableBox{
  width: 100%;
  margin-top:20px;
  overflow-y:hidden;
  overflow-x:scroll;
}
.jjyChengUI-tableBox table{
  min-width: 100%;
  border-collapse: collapse; 
}
.jjyChengUI-tableBox table, 
.jjyChengUI-tableBox thead,
.jjyChengUI-tableBox tr, 
.jjyChengUI-tableBox td, 
.jjyChengUI-tableBox th {
     border: 1px solid #E2E2E2;
}
.jjyChengUI-tableBox table thead{
  background-color: #F2F2F2;
}
.jjyChengUI-tableBox table th,
.jjyChengUI-tableBox table td{
  min-width: 100px;
  min-height: 36px;
  line-height: 36px; 
  padding: 0px 10px;
  word-break: keep-all;
  white-space: nowrap;
}
.jjyChengUI-tableBox table tr:nth-child(even)
{
  background: #f1f1f1;
}
/*=====分割线=====*/
table{
  width: 800px;
}
.txt-l{
  text-align: left; 
}
```
#### 效果
![Alt](dom.png)