美文网首页
getElementById返回的究竟是什么

getElementById返回的究竟是什么

作者: DecadeHeart | 来源:发表于2017-03-24 13:55 被阅读0次
    Paste_Image.png

    var mydivEle = document.getElementById("mydiv"); //<div id="mydiv"></div>
    alert(mydivEle);
    //输出:object HTMLDivElement【IE8只显示Object,Chrome显示object HTMLDivElement】

    1. alert(getElementById("mydiv").tagName) 语句会报错吗? HTMLDivElement 有tagName这个属性么,它都有哪些属性?
      会显示标签名:DIV,此处返回的tagName都是大写
      那么HTMLElement还有什么其他属性呢
      继承了Element\Node的属性和方法

    属性:
      className
      currentStyle
      dir
      id
      innerHTML
      lang
      offsetHeight,offsetWidth
      offsetLeft,offsetTop
      offsetParent
      scrollHeight, scrollWidth
      scrollTop, scrollLeft
      style:返回为当前元素设置内联 CSS 样式的 style 属性的值,类型CSS2Properties
      title
    方法:scrollIntoView()

    1. 如何修改getElementById()得到的div的样式呢?这个样式又是通过 HTMLDivElement 的什么属性or方法or子对象 访问到的呢?

    document.getElementById("id").style.property="值"

    1. 注意
        只有使用内联样式,即直接把CSS写在HTML元素的style属性中

    <div id="d1" style="width:100px;height:200px;"></div>
    alert(document.getElementById('d1').style.width);//100px
      否则浏览器只会返回空字符串。详细见此。其实,最好还是使用JQuery,简单快捷:$("d1").width(),不用考虑是不是内联样式。
      然后,这里想抛出个引子:其实JQuery中的 .width() 得到的并不是真正的 CSS 中的 width

    相关文章

      网友评论

          本文标题:getElementById返回的究竟是什么

          本文链接:https://www.haomeiwen.com/subject/ynqfottx.html