码迷,mamicode.com
首页 > Web开发 > 详细

js的高级操作

时间:2018-12-20 22:17:22      阅读:246      评论:0      收藏:0      [点我收藏+]

标签:rem   name   标签   over   选择器   字符串类   冒泡   setattr   决定   

1.对象使用的高级

对象的key为字符串类型, value为任意类型

var obj = {

    name: "name",

    "person-age": 18

}

// 访问

obj.name | obj["name"]

obj["person-age"]

 

对象的属性可以任意添加与删除

var obj = {

     name: "obj"

}

// 删除

delete obj.name

// 添加

obj.age = 18  // 如果age的key已存在就是修改值, 不存在就是添加键值对, 添加的key任意

// 注: 获取的页面元素(标签对象)也可以任意添加/删除属性

 

 

2.页面标签全局属性操作

ele.getAttribute("alert");

// 获取页面标签ele的alert全局属性的值, 如果没有该全局属性值为null

 

ele.setAttribute("attr_key", "attr_value");

// 页面标签ele已有该全局属性,就是修改值, 没有就是添加该全局属性并赋相应值

// 注: 一般应用场景, 结合css的属性选择器完成样式修改

 

 

3.事件

事件的绑定
// 第一种

box.onclick = function(){}

// 只能绑定一个实现体, 如果有多次绑定, 保留最后一次

// box.onclick = null来取消事件的绑定

 

// 第二种

var fn = function() {}

box.addEventListener(‘click‘, fn)

// 能绑定多个实现体, 如果有多次绑定, 按顺序依次执行

// box.removerEventListener(‘click‘, fn)来取消事件的绑定

// 了解: 第三个参数决定冒泡顺序(子父级谁先相应事件)

 

事件对象

// 系统回调事件函数时, 传递了一个 事件(event) 实参

// 如果要使用传递来的实参 事件(event), 定义接收的 形参 即可

box.onclick = function(ev){

    // 使用事件对象

    // 特殊按键 eg: ev.altKey: true | false

    // 鼠标触发点: ev.clientX | ev.clientY

   

    // 取消冒泡

    ev.cancelBubber = true;

   

    // 取消默认事件

    return false;

}

 

js的高级操作

标签:rem   name   标签   over   选择器   字符串类   冒泡   setattr   决定   

原文地址:https://www.cnblogs.com/zhouhai007/p/10152653.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!