一.取得html元素

详情见:https://www.jb51.net/article/116460.htm

1.通过ID获取(getElementById)

document.getElementById('id')

2.通过name属性(getElementsByName)

document.getElementsByName('name')

3.通过标签名(getElementsByTagName)

document.getElementsByTagName('p')

4.通过类名(getElementsByClassName)

document.getElementsByClassName('class')

5.获取html的方法(document.documentElement)

document.documentElement是专门获取html这个标签的。

document.documentElement

浏览器控制台返回结果:

6.获取body的方法(document.body)

document.body是专门获取body这个标签的。

document.body

浏览器控制台返回结果:

7.通过选择器获取一个元素(querySelector)

document.querySelector('div .class')

8.通过选择器获取一组元素(querySelectorAll)

ocument.querySelectorAll('div .class')

二.取得html样式

取得元素的style即可:

document.getElementById('id').style

如:取得高度

document.getElementById('id').style.height

也可使用方法getBoundingClientRect(),取得更精确的信息:

document.getElementById('id').getBoundingClientRect().width

三.修改html样式

修改元素的style即可:

document.getElementById('id').style.height='10px'

[javascript]javascript取得html元素,取得html样式,修改html样式的更多相关文章

  1. 【温故而知新-Javascript】为DOM元素设置样式

    1. 使用样式表 可以通过document.styleSheets属性访问文档中可用的CSS样式表,它会返回一组对象集合,这些对象代表了与文档管理的各个样式表. 每个样式表 都由一个CSSStyleS ...

  2. JavaScript访问修改css样式表

    1.访问元素中style属性的css样式 可以根据属性的ID或name标签利用dom操作直接访问到内部的css样式,直接使用style对象访问 <div id="myid" ...

  3. JavaScript 应用开发 #5:为完成的任务添加样式

    判断一下任务的状态,如果是完成的任务,可以在任务项目的上面,添加一个额外的 css 类,在这个 css 类里,可以去定义完成的任务的样式.比如,把文字的颜色变成浅友色,并且在文字上面添加一条删除线.这 ...

  4. javascript改变style样式和css样式

    转载 在很多情况下,都需要对网页上元素的样式进行动态的修改.在JavaScript中提供几种方式动态的修改样式,下面将介绍方法的使用.效果.以及缺陷. 1.使用obj.className来修改样式表的 ...

  5. js | javascript改变style样式和css样式

    转载 在很多情况下,都需要对网页上元素的样式进行动态的修改.在JavaScript中提供几种方式动态的修改样式,下面将介绍方法的使用.效果.以及缺陷. 1.使用obj.className来修改样式表的 ...

  6. javascript 动态修改css样式方法汇总(四种方法)

    在很多情况下,都需要对网页上元素的样式进行动态的修改.在JavaScript中提供几种方式动态的修改样式,下面将介绍方法的使用.效果.以及缺陷. 1.使用obj.className来修改样式表的类名. ...

  7. JavaScript通过ID获取元素坐标

    JavaScript通过ID获取元素坐标 function getElementPos(elementId) {    var ua = navigator.userAgent.toLowerCase ...

  8. JavaScript实现拖拽元素对齐到网格(每次移动固定距离)

    这几天在做一个拖拽元素的附加功能,就是对齐到网格,实际上就是确定好元素的初始位置,然后拖拽元素时,每次移动固定的距离.让元素都可以在网格内对齐.先上效果图,然后在详细说明一下细节问题 做了一个gif图 ...

  9. JavaScript移除数组元素减少长度的方法

    JavaScript移除数组元素减少长度的方法,代码如下: //数组移除长度方法 var array=[];  array[0]="张三";  array[1]="李四& ...

随机推荐

  1. 几何+点与线段的位置关系+二分(POJ2318)

    TOYS Time Limit: 2000MS   Memory Limit: 65536K Total Submissions: 10666   Accepted: 5128 Description ...

  2. MySQL监控、性能分析——工具篇(转载)

    MySQL越来越被更多企业接受,随着企业发展,MySQL存储数据日益膨胀,MySQL的性能分析.监控预警.容量扩展议题越来越多.“工欲善其事,必先利其器”,那么我们如何在进行MySQL性能分析.监控预 ...

  3. 【css预处理器】------css预处理器及sass基本介绍------【巷子】

    001.什么是css预处理器? css预处理器定义了一种新的语言.用一种专门的编程语言,为css增加了一些编程的特性,将css作为目标生成文件,然后开发者就只要使用这种语言进行编码工作.(通俗点说“” ...

  4. 170512、java日志文件log4j.properties配置详解

    一.Log4j配置 第一步:加入log4j-1.2.8.jar到lib下. 第二步:在CLASSPATH下建立log4j.properties.内容如下: 放在src下的话就不用配置 否则得去web. ...

  5. Linux--vim编辑器和文件恢复

    第五章  Vim编辑器和恢复ext4下误删除的文件-Xmanager工具 本节所讲内容: 5.1  vim的使用 5.2  实战:恢复ext4文件系统下误删除的文件 5.3  实战:使用xmanage ...

  6. Jenkins之pipeline流水线配置

    使用gitlab监听事件一旦git push自动部署 使用构建后操作 配置完用户构建前一步会自动构建下一个项目 pipeline插件 新建视图 点击run运行

  7. HDU 4745 Two Rabbits(区间DP,最长非连续回文子串)

    Two Rabbits Time Limit: 10000/5000 MS (Java/Others) Memory Limit: 65535/65535 K (Java/Others) Total ...

  8. Oracle数据库PL/SQL Developer查询结果显示问号乱码的解决方法

    PL SQL Developer,查询结果中的中文变成了一堆问号,SQL语句中的中文被提示invalid character,不能识别. 解决方法: 执行,select userenv('langua ...

  9. ZOJ2588:Burning Bridges(无向连通图求割边)

    题目:http://acm.zju.edu.cn/onlinejudge/showProblem.do?problemId=1588 吐下槽,不得不说ZOJ好坑,模版题做了一个多小时. 题意:*    ...

  10. 2.6 The Object Model -- Bindings

    一个binding在两个属性之间创建一个链接,当一个改变时,另外一个被自动更新为一个新的值. bindings可以在同一个对象中连接两个属性,或者用在两个不同的对象中. 不像大多数框架一样包含某种形式 ...