zoukankan      html  css  js  c++  java
  • 09.05 javascript 属性 内置属性 自定义属性 DOM文档对象模型

    # 属性
    ### 内置属性
    * js对象和html标签有映射关系

    ### 自定义属性
    * getAttribute()
    * setAttribute()
    * hasAttribute()
    * removeAttribute()

    ### H5新增的自定义属性操作操作
    * HTML:  `<tag data-attr="">`
    * JS :  element.dataset.attr

    ### 把属性当做属性节点
    * getAttributeNode(attrname)



    # 元素的内容
    ### 作为HTML的元素内容
    * innerHTML
    * outerHTML

    ### 作为纯文本的元素内容
    * innerText    会忽略多余的空格
    * textContent   IE9+

    ### 作为Text节点操作




    # 元素操作(节点)
    ### 创建元素
    * document.createElement(tagName)

    ### 添加元素(给父元素添加子元素)
    * appendChild(node)
    * insertBefore(newNode, oldNode)

    ### 删除元素
    * removeChild(node)

    ### 替换元素
    * replaceChild(newNode, oldNode)

    ### 克隆节点
    * cloneNode(false)



    # 元素的尺寸大小
    ### 元素的位置
    * getBoundingClientRect()
    * offsetLeft/offsetTop
    * clientLeft/clientTop
    * offsetParent

    ### 元素的尺寸
    * getBoundingClientRect()
    * offsetWidth/offsetHeight
    * clientWidth/clientHeight
    * scrollWidth/scrollHeight


    ### 滚动距离
    * scrollLeft
    * scrollTop


    # docuemnt 
    ### 属性
    * URL    只读
    * domain   只读
    * referrer   只读
    * lastModified   文档的最后一次修改时间    只读
    * location  对location对象引用
    * title    文档标题


    ### 方法
    * write()
    * writinln()


    # 表单DOM
    ### Form元素
    * submit()
    * reset()
    * elements

    ### 按钮(submit reset button)
    * click()
    * blur()
    * focus()

    ### 单选/复选
    * click()
    * blur()
    * focus()


    ### 文本(input textarea)
    * blur()
    * focus()
    * select()


    ### select
    * add()  新增选项

     

  • 相关阅读:
    vue实战(3):底部导航显示、搭建各模块静态页面、添加登录页页面与路由
    vue实战(2):初始化项目、搭建底部导航路由
    hexo
    移动端自适应
    vue过场动画
    获取 TypeScript
    TypeScript 与 JavaScript 的区别
    api封装使用
    vue学习
    dom的增删改
  • 原文地址:https://www.cnblogs.com/lwwnuo/p/7479967.html
Copyright © 2011-2022 走看看