vue及js常用方法（更新中）

• 原生js判断某个元素是否有指定的class名的几种方法

var p = document.getElementsByTagName('p');

for(var i = 0;i <p.length;i++){

　　//第一种方法，用classList这个H5 API，有兼容性问题

　　if(p[i].classList.contains('test')==true){
　　　　console.log(p[i].innerHTML);
      }

　　//第二种方法，用className这个属性

　　if(p[i].className=='test'){
　　　　console.log(p[i].innerHTML)
     }

　　//第三种方法，用getAttribute()这个方法

　　if(p[i].getAttribute("class")=='test'){
      　　console.log(p[i].innerHTML);
   　}

}

 

• obj（判断对象中是否包含某个key属性）

!("key" in obj)    //不包含

obj.hasOwnProperty("key")   //包含

# 手机端触摸移动监听
touch事件
    
当在屏幕上按下手指时触发 touchstart
    
当在屏幕上移动手指时触发 touchmove

   
当在屏幕上抬起手指时触发 touchend

示例：

mounted(){
   // 触摸监听
    document.querySelector('.add').addEventListener('touchmove',this.handletouchMove,false)
},
methods: {
    handletouchMove (event) {
        console.log(event.touches[0].clientY)
    }
},
destroyed(){
    document.querySelector('.add').removeEventListener('touchmove',this.handletouchMove)
}

//clientX：触摸目标在视口中的x坐标。
//clientY：触摸目标在视口中的y坐标

参考：https://blog.csdn.net/oQingHeYiKan12/article/details/84228514
 

• 回车提交表单（含vue+element）

1、el-button

<el-button type="primary" @click="submit('former')" native-type="submit">立即登录</el-button>

2、el-input

<el-input v-model="form.user" @keyup.enter.native="submit('form')"></el-input>

3、input

<input v-model="form.name" placeholder="昵称" @keyup.enter="submit">

4.绑定事件

document.addEventListener('keydown',this.hanglekeydown,false)

vue下可能会出现提交后，链接地址中间段无故多出了很多字符串的情况，需要使用： @submit.native.prevent

<el-form id="former" @submit.native.prevent>
  <!-- some code -->
</el-form>