zoukankan      html  css  js  c++  java
  • js基础八

    10个div点击一个div变绿色,其他都为红色,立即执行函数包裹代码防止全局变量产生
    选取对象集合
    如何实现,给每个div添加事件,循环这个对象集合
    (在点击的这个div的时候做判断,判断当前的这个div是否是红色,如果是红色就变为绿色,
    把所有div变成绿色,再把当前点击的这个div变成红色(所有div的点颜色赋值为绿色,点击的style的背景颜色赋值为红色)
    再点击红色的时候把红色再次变为绿色,把当前div变成绿色
    方法二:添加类名的方式


    操作元素内容:
    innerHTML 设置或获取标签当中的内容( 识别HTML )设置或转换成字符串,保存到innerHTML中去 赋值的话会修改标签中的内容:div.innerHTML = 'hello,world'按照标签的写法写的话就会是一个标准的标签
    innerContent(ie浏览器中中无法使用,ie中没有这个属性)常规浏览器获取纯文本
    innerText ie浏览器中使用这个,获取纯文本

    以下判断是否是ie浏览器
    if(div.textContent !== undefined){
    var text = div.textContent;
    }else{
    var text = div.innerText;
    }

    alert(text)


    【不能再判断中使用函数】


    css层叠样式表

    document.styleSheets回样式表的集合
    document.styleSheets[index].rules 返回样式表中选择器的集合
    document.styleSheets[index].rules[index].style.attr查找样式表中的样式属性(ie chrom


    元素最终的样式

    来获取当前对象的最终样式:window.getComputedStyle(object,null).attr ( W3C )
    获取当前对象的尺寸:clientWidth/clientHeight: 元素可视部分的高度和宽度(width + padding) ,也就是包含了padding,不包含border、margin
    offsetWidth/offsetHeight: 元素实际的高度和宽度(width+padding+border),也就是包含border和padding


    DOM(稳当对象模型 标签里面的文本也会看成一个节点


    节点的关系,类似家族有父节点和子节点,但是子节点不一定会有,比如文本就不会有子节点
    如何获取节点对象:


    通过元素获取节点的四种方式:
    document.getElementById("elementID");获取标签元素节点
    document.getElementsByTagName("tagname");标签名的对象的集合
    document.getElementsByName("name");名称的对象的集合
    document.getElementsByClassName("classname");类名的元素集合

    元素节点是可以直接获取的
    somNode.parentNode任何节点的父节点都可以是这个表示,当前节点的父节点
    childNode 子节点 包含所有节点,文本节点也包含在内的,比如空格为txt节点
    children 只包含标签节点,不包含text节点
    firstchild 当前元素的所有子节点中的第一个子节点 打印第一个子节点firstchild[],括号里写角标
    获取最后一个子节点 lastChild
    nextSibling获取兄弟节点 换行符

    操作节点: 以下四个方法属于父元素的方法,都是剪切过去的
    appendChild添加子元素

    appendChild把标签插入到另一个标签的子元素的末尾
    var div = document.getElementById("div");
    var p = document.getElementById("p");
    div.appendChild(p)

    insertbefore(childNode,nextNode)——要插入的节点,参照的节点,同一个节点只能在dom树中出现一次,之前位置就没有了 如果第二个参数为null的话,默认添加到末尾(剪切操作


    replaceChild(p,select);替换节点(剪切操作
    removeChild移除节点


    $0
    sources 断点调试

    cloneNode(isDeepcopy) 属于复制的方法 isDeepcopy:深度复制,当isDeepcopy的值是true则是一个深度复制,当isDeepcopy的值是fluse则是一个浅度复制
    deeplist.
    document.createElement(tagName)通过标签名创建一个元素节点。接受一个字符串参数,这个字符串即为标签名字


  • 相关阅读:
    mysql从一张表查出数据存到另一张表和inner join的用法
    pycharm 看函数列表
    git删除本地所有的更改
    mysql create的几种用法和将字段设为插入时间
    python 装饰器
    pycharm退出unittest模式
    股票基础知识
    linux中查找路径下包含某字符串的所有文件
    SQL distinct用法
    SQL update用法
  • 原文地址:https://www.cnblogs.com/duanfuying/p/6033220.html
Copyright © 2011-2022 走看看