zoukankan      html  css  js  c++  java
  • DOM

    Dom:
    1 找到标签
    直接找
    document.getElementById('id_name') #根据ID获取单个元素
    document.getElementsByTagName('div') #根据tagname获取多个元素
    document.getElementsByClassName('class_name') #根据Classname获取多个元素
    document.getElementsByName #根据name获取多个元素
    间接找
    tag = document.getElementById('id_name')
    parentNode # 父节点
    childNodes # 所有子节点
    firstChild # 第一个子节点
    lastChild # 最后一个子节点
    nextSibling # 下一个兄弟节点
    previousSibling # 上一个兄弟节点

    parentElement # 父节点标签元素
    children # 所有子标签
    firstElementChild # 第一个子标签元素
    lastElementChild # 最后一个子标签元素
    nextElementtSibling # 下一个兄弟标签元素
    previousElementSibling # 上一个兄弟标签元素
    2 操作标签
    文件内容
    tag.innerText: #获取标签里的文本全部内容,会过滤掉html标签
    tag.innerHTML: #获取标签里的全部内容
    tag.value: #对于input系列生效

    tag.className: #class的name
    tag.classList: #class的name的list
    remove: #删除指定样式
    add: #添加指定样式
    checkbox:
    checked


    3 样式操作
    <div class="c1 c2" style='font-size:16px;'></div>
    obj.style.fontSize='16px';

    4 属性操作
    obj.setAttribute('xxx', 'hinimix'); #设置属性
    obj.removeAttribute('xxx') #移除属性
    obj.getAttribute('xxx') #单个属性
    obj.attributes #所有属性

    5 创建标签
    1: 2b function
    tag = "<input type='text'/>"
    document.getElementById("show").insertAdjacentHTML("beforeEnd", tag);
    插入位置
    beforeBegin
    afterBegin
    beforeEnd
    afterEnd
    2: clever function
    tag = document.createElement('input')
    tag.setAttribute('type', 'text')
    tag.style.fontSize = '16px'
    tag.style.color = 'red'
    document.getElementById("show").appendChild(tag);

    6 Dom提交表单
    任何标签都能提交表单
    document.getElementById('a1').submit();

    7 other:
    console.log
    alert()
    confirm("infomation") #choice true/false
    locaton.reload() #refresh local page
    location.href #jump to dest web site
    location.href = location.href ==> location.reload()
    setInterval:
    var obj = setInterval(function(){}, 4000}
    clearInterval:
    clearInterval(obj)
    setTimeout()
    clearTimeout()

    8 事件:
    onclick
    onfocus
    onblur
    onmouseover
    onmouserout
  • 相关阅读:
    WPF / Win Form:多线程去修改或访问UI线程数据的方法( winform 跨线程访问UI控件 )
    TCP 流模式与UDP数据报模式(转)
    hibernate 检索方式
    【UVA】1449-Dominating Patterns(AC自己主动机)
    软件项目工作流程图
    iOS7 UIKit动力学-碰撞特性UICollisionBehavior 下
    东莞无人工厂变成现实,中国无人工厂将非常快普及,保住世界工厂地位
    小米手机与魅族的PK战结果 说明了什么
    python Debug 单步调试
    合并两个排序的单链表
  • 原文地址:https://www.cnblogs.com/hinimix/p/9275127.html
Copyright © 2011-2022 走看看