1、通过标签获取元素，返回一个数组

　　var li = document.getElementsByTagName('li');//标签获取元素

　　li[0].innerHTML;// 查看获取元素的内容

　　li[0].innerHTML = "content";//修改获取到标签中的内容　　

2、通过id获取页面元素

　　var header = document.getElementById("header");//id获取元素

3、通过class名字获取页面元素

　　var list = document.getElementsByClassName('list');//返回一个数组，通过下标访问文本

4、通过CSS选择符方式获取页面元素

　　//querySelector：返回符合条件的第一个
　　var str = document.querySelector('li');

　　var str1 = document.querySelectorAll('li');//全部返回，每个li都是一个对象

 <!DOCTYPE html>

 <html lang="zh-cn">

 <head>

     <meta charset="UTF-8">

     <title>JavaScript获取页面的常用方法</title>

     <script>

             // 1、通过标签获取元素，返回一个数组

             var li = document.getElementsByTagName('li');

             //2、通过id获取页面元素

             var header = document.getElementById("header");

             // 3、通过class名字获取页面元素

             var list = document.getElementsByClassName('list');//返回一个数组，通过下标访问文本

             // 4、通过CSS选择符方式获取页面元素

             //querySelector：返回符合条件的第一个

             var str = document.querySelector('li');

             // querySelectorAll：返回符合条件的每一个

             var str1 = document.querySelectorAll('li');

     </script>

 </head>

 <body>

     <p id="header">JavaScript学习</p>

     <ul class="list">

         <li>HTML</li>

         <li>jQuery</li>

         <li>JavaScript</li>

     </ul>

     <ul class="list">

         <li>HTML</li>

         <li>jQuery</li>

         <li>JavaScript</li>

     </ul>

 </body>

 </html>

JavaScript获取页面元素的常用方法的更多相关文章

  1. 用javaScript获取页面元素值

    用JavaScript获取页面元素常见的三种方法:                                                           getElementById() ...

  2. 用Javascript获取页面元素的位置

    制作网页的过程中,你有时候需要知道某个元素在网页上的确切位置. 下面的教程总结了Javascript在网页定位方面的相关知识. 一.网页的大小和浏览器窗口的大小 首先,要明确两个基本概念. 一张网页的 ...

  3. Javascript获取页面元素相对和绝对位置

    制作网页的过程中,你有时候需要知道某个元素在网页上的确切位置. 下面的教程总结了Javascript在网页定位方面的相关知识. 一.网页的大小和浏览器窗口的大小 首先,要明确两个基本概念. 一张网页的 ...

  4. JavaScript 获取页面元素

    一.根据 id 获取元素 语法格式: document.getElementById(id); Demo: var main = document.getElementById('main'); co ...

  5. JavaScript获取页面元素方法

  6. JavaScript DOM编程基础精华01（DOM入门，DOM模型和获取页面元素,事件，window对象的方法）

    DOM入门 DOM就是Html页面的模型,将每个标签都做为一个对象,JavaScript通过调用DOM中的属性.方法就可以对网页中的文本框.层等元素进行编程控制.比如通过操作文本框的DOM对象,就可以 ...

  7. js获取页面元素距离浏览器工作区顶端的距离

    先介绍几个属性:(暂时只测了IE和firefox,实际上我工作中用到的最多的是chrome)  网页被卷起来的高度/宽度(即浏览器滚动条滚动后隐藏的页面内容高度) (javascript)       ...

  8. 用getBoundingClientRect()来获取页面元素的位置

    以前绝大多数的使用下面的代码来获取页面元素的位置: [code="javascript"]var _x = 0, _y = 0;do{_x += el.offsetLeft;_y ...

  9. js中获取页面元素节点的几种方式

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

随机推荐

  1. Qt编写气体安全管理系统16-云端同步

    一.前言 云端同步功能是为了后期的拓展做准备的,他的目的就是将本地的数据库中的记录,比如实时采集到的数据以及存储的运行记录等,同步到云端数据库上,默认采用阿里云的mysql数据库,阿里云速度还是挺快的 ...

  2. Flink 实现指定时长或消息条数的触发器

    Flink 中窗口是很重要的一个功能,而窗口又经常配合触发器一起使用. Flink 自带的触发器大概有: CountTrigger: 指定条数触发 ContinuousEventTimeTrigger ...

  3. 改进初学者的PID-积分饱和

    最近看到了Brett Beauregard发表的有关PID的系列文章,感觉对于理解PID算法很有帮助,于是将系列文章翻译过来!在自我提高的过程中,也希望对同道中人有所帮助.作者Brett Beaure ...

  4. 【mysql】添加删除权限

    https://www.cnblogs.com/wuxunyan/p/9095016.html

  5. 【物联网】arduino wifi

    https://www.arduino.cn/forum.php?mod=viewthread&tid=49561 http://dy.163.com/v2/article/detail/DC ...

  6. Win10安装DB2配置笔记

    响应文件名:D:\data\DB2\PROD_EXPC.rsp 安装文件夹--目录:D:\Program Files\IBM\SQLLIB\ IBM SSH Server安装位置:D:\Program ...

  7. 你应该知道的4个DSP开发支持库

    引言 在dsp开发中,为了节省开发时间和难度,TI将一些成熟的算法封装为模块,供开发者使用.如果能充分利用这些算法支持库,对于加快dsp开发进程与提高代码质量.稳定性有非常大的帮助. Digital ...

  8. Python标准库: functools (cmp_to_key, lru_cache, total_ordering, partial, partialmethod, reduce, singledispatch, update_wrapper, wraps)

    functools模块处理的对象都是其他的函数,任何可调用对象都可以被视为用于此模块的函数. 1. functools.cmp_to_key(func) 因为Python3不支持比较函数,cmp_to ...

  9. UN Report: Last 10 Years Likely the Hottest Decade on Record——VOA慢速英语

    听力地址:UN Report: Last 10 Years Likely the Hottest Decade on Record 中英对照:联合国报告称过去十年可能是有记录以来最热的十年 Words ...

  10. ubuntu下安装chrome浏览器和flash插件

    chrome浏览器可在Ubuntu软件中心里搜索并安装 falsh插件首先去官网下载合适的包然后,按照readme安装,执行sudo cp -r usr/* /usr 和sudo cp libflas ...