前端开发中的小技巧

一、纯文本内容提取

?

1 2 3 4 5 6 7 8 9 10

/**  * 摘取纯文本内容  * */ setContent(content) {   if (content) {     return JSON.parse(JSON.stringify(content).replace(/<\/?.+?\/?>/g, ''))   } else {     return ''   } },

 

?

1 2 3 4 5 6 7

/**  * 使用方法  * */　　　　res.data.data.rows.forEach((item, index) => {         if (item.texts) {           item.texts = _this.setContent(item.texts)         }       })

 二、文字裁剪

　　1.js方式进行裁剪

?

1 2 3 4 5 6 7 8 9 10 11

/**  * 文字裁剪  */ clampText() {   this.$nextTick(() => {     const clampDom = document.querySelectorAll('.clamp2')     clampDom.forEach(item => {       $clamp(item, {clamp: 2})     })   }) },

 　　2.css方式进行裁剪

?

1 2 3 4 5 6

.etc3 {   overflow: hidden;   display: -webkit-box;   -webkit-box-orient: vertical;   -webkit-line-clamp: 2; }

  三、_this的使用

　　const _this = this 一般是window对象里边给当前对象进行赋值的时候，使用_this进行赋值，因为在window对象下使用的是this指向的是window，使用_this 的时候指向的是当前的对象

 四、a标签和js界面跳转

　　1.在同一个窗口打开新界面　　

?

1 2 3 4 5

<a href="http://www.jb51.net" title="脚本之家">Welcome</a>   等效于js代码   window.location.href="http://www.jb51.net";     //在同当前窗口中打开窗口

　　2.在不通的窗口打开新界面

?

1 2 3 4 5

<a href="http://www.jb51.net" title="脚本之家" target="_blank">Welcome</a>   等效于js代码   window.open("http://www.jb51.net");                 //在另外新建窗口中打开窗口