美文网首页前端
DOM样式操作

DOM样式操作

作者: leomei91 | 来源:发表于2017-06-21 14:04 被阅读0次

DOM的理念:一切皆节点。方法和属性都是依赖于元素对象存在的。

DOM的节点有

文档节点、元素节点、属性节点、文本节点、注释节点

className.add
className.remove
classList.add
obj = getElementById('test');
obj.style.fontSize = "16px";

属性操作

obj.setAttribute('属性','值') 增加属性
obj.attributes
obj.removeAttribute('属性')

修改样式

obj.style.color="red" //如果样式有就重新设置,没有相当于新增一个样式

创建元素

tag = "<p></p>"
p = document.createElement('元素')
p.appendChild(tag);
p.insertAdjanceHTML('beforeEnd',tag)
这里有4个值,`beforeBegin`,`afterEnd`,`afterBegin`。前者表示在子元素中添加,后者表示在兄弟元素添加。

创建文本节点

t = document.createTextNode('文本')
obj.appendChild(t) //将文件节点加入到obj元素节点。

:before:after

在被选元素的前面或者后面插入内容

相关文章

  • 2.DOM:操作元素(innerText、innerHTML、属

    操作元素 ​ JavaScript的 DOM 操作可以改变网页内容、结构和样式,我们可以利用 DOM 操作元素...

  • DOM样式操作

    class 类名样式操作 toggleClass 示范 设置获取html文本和值 val()表单常用另外了解p82

  • DOM样式操作

    DOM的理念:一切皆节点。方法和属性都是依赖于元素对象存在的。 DOM的节点有 文档节点、元素节点、属性节点、文本...

  • DOM样式操作

    更新样式 element.style:增加了内嵌样式表,每一次设置属性都只能一句句设置element.style ...

  • Dom样式操作

    样式操作 一、 概要 通过JavaScript获取dom元素上的style属性,我们可以动态的给元素赋予样式属性。...

  • 「DOM 编程」样式操作

    样式操作CSS 对应 DOM 对象内部样式表行内样式更新样式element.styleelement.style....

  • 12 DOM2 和 DOM3

    本章内容 DOM2 和 DOM3 的变化 操作样式的 DOM API DOM 遍历与范围 12.1 DOM 变化 ...

  • DOM属性操作.样式操作

    每个HTML属性对应相应的DOM对象操作 属性操作 getAttribute()获取元素的attribute值 s...

  • web自动化_dom

    js不能直接操作html元素,比如要修改元素的样式,需要通过dom对象操作html元素js ->dom对象->调用...

  • Chrome DevTools

    概览 Element 第一部分:操作dom元素查看DOM树选取DOM节点操作DOM节点 第二部分查看界面样式修改界...

网友评论

    本文标题:DOM样式操作

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