ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

DOM学习之如何修改元素,即修改 特性, 内容, 样式

2022-05-16 23:02:26  阅读:111  来源: 互联网

标签:style DOM 样式 元素 修改 赋值 属性


1、修改内容: 3种方式修改内容
a. 获取或赋值元素的HTML内容:

元素.innerHTML

b. 获取或赋值元素的纯文本内容:

元素.textContent

c. 获取或赋值表单元素的值:

表单元素.value

2、修改属性: 3种

a. 字符串类型的HTML标准属性: 2种:
1). 旧核心DOM: 4个函数

元素.getAttribute("属性名");
元素.setAttribute("属性名", "属性值")
var bool=元素.hasAttribute("属性名")
元素.removeAttribute("属性名")
//优点: 万能, 缺点: 繁琐

2). 新HTML DOM:

元素.属性名  (目前只发现id特性可用 , 如<div id="d1"></div>   则div.id 返回"d1")
元素.属性名="属性值"  (div.className = "类名")
元素.属性名!==""
元素.属性名=""

3. 修改样式:
a. 修改元素的样式:

元素.style.css属性="属性值"
也可用元素.style.样式名查询现样式, 但只对内嵌样式有效,赋值如上不受限制。
b. 获取元素的完整样式:

var style=getComputedStyle(元素对象);
style.css属性
//计算后的样式都是只读的

c. 批量修改元素的样式时,都用class:

元素.className="class名"

 

标签:style,DOM,样式,元素,修改,赋值,属性
来源: https://www.cnblogs.com/wgqy/p/16278965.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有