一.取得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. scikit_learn 中文说明入门

    原文:http://www.cnblogs.com/taceywong/p/4568806.html 原文地址:http://scikit-learn.org/stable/tutorial/basi ...

  2. sqlserver 2012隐藏查询结果窗口

    1, 08r2的时候都是可以用 ctrl+r隐藏的 到了2012就不行了 方法 . 2, 快捷键的设置

  3. Python爬虫实例(五) requests+flask构建自己的电影库

    目标任务:使用requests抓取电影网站信息和下载链接保存到数据库中,然后使用flask做数据展示. 爬取的网站在这里 最终效果如下: 主页: 可以进行搜索:输入水形物语 点击标题进入详情页: 爬虫 ...

  4. Python爬虫基础(四)Requests库的使用

    requests文档 首先需要安装:pip install requests get请求 最基本的get: # -*- coding: utf-8 -*-import requests respons ...

  5. PHP面向对象详解:继承、封装与多态

    首先,在解释面向对象之前先解释下什么是面向对象? [面向对象]1.什么是类? 具有相同属性(特征)和方法(行为)的一系列个体的集合,类是一个抽象的概念2.什么是对象?从类中拿到的具有具体属性值得个体, ...

  6. Team Formation---zoj3870(异或)

    题目链接:http://acm.zju.edu.cn/onlinejudge/showProblem.do?problemId=5518 题意就是有n个数,如果满足a^b > MAX(a, b) ...

  7. 11.Git分支管理

    分支就是科幻电影里面的平行宇宙,当你正在电脑前努力学习Git的时候,另一个你正在另一个平行宇宙里努力学习SVN. 如果两个平行宇宙互不干扰,那对现在的你也没啥影响.不过,在某个时间点,两个平行宇宙合并 ...

  8. MySQL多个相同结构的表查询并把结果合并放在一起的语句(union all)

    union all select *,'1' as category from table1001 where price > 10 union all select *,'2' as cate ...

  9. c primer plus(五版)编程练习-第七章编程练习

    1.编写一个程序.该程序读取输入直到遇到#字符,然后报告读取的空格数目.读取的换行符数目以及读取的所有其他字符数目. #include<stdio.h> #include<ctype ...

  10. import static

    import static(静态导入)是JDK1.5中的新特性,一般我们导入一个类都用 import com.....ClassName;而静态导入是这样:import static com..... ...