一、DOM查找

   1、document.getElementById("id")

     -功能:返回对拥有指定ID的第一个对象的引用

     -返回值:DOM对象

     -说明:id为DOM元素上id属性的值

   2、document.getElementByTagName("tag")

      -功能:返回一个对所有tag标签引用的集合

      -返回值:数组

      -说明:tag为要获取的标签名称

二、DOM设置元素样式

   1、ele.style.styleName=styleValue

    -功能:设置ele元素的CSS样式

    -说明

      -ele为要设置样式的DOM对象

      -styleName为要设置的样式名称

      -styleValue为要设置的样式值

三、innerHTML和className

    1、ele.innerHTML

      -功能:返回ele元素开始和结束标签之间的HTML

    2、ele.innerHTML="html"

      -功能:设置ele元素开始和结束标签之间的HTML内容为html

    3、ele.className

      -功能:返回ele元素的class属性

    4、ele.className="cls"

      -功能:设置ele元素的class属性为cls

四、DOM属性设置与获取

  1、ele.getAttribute("attribute")

    -功能:获取ele元素的attribute属性

    -说明;

      -ele是要操作的DOM对象

      -attribute是要获取的html属性(如:id,type)

  2、ele.setAttribute("attribute",value)

    -功能:在ele元素上设置属性

     -说明:

      -ele是要操作的dom对象

      -attribute为要设置的属性名称

      -value为设置attribute属性的值

  

JavaScript Dom基础的更多相关文章

  1. JavaScript Dom基础-9-Dom查找方法; 设置DOM元素的样式; innerHTML属性的应用; className属性的应用; DOM元素上添加删除获取属性;

    JavaScript Dom基础 学习目标 1.掌握基本的Dom查找方法 domcument.getElementById() Domcument.getElementBy TagName() 2.掌 ...

  2. JavaScript DOM 基础操作

    JavaScript DOM 基础操作 一.获取元素的六方式 document.getElementById('id名称') //根据id名称获取 document.getElementsByclas ...

  3. JavaScript DOM基础总结

    上个月在进行百度三面时候,面试官提问JavaScript DOM方法,我回答的有点少,前面太关注JavaScript 兼容性,框架方面,JavaScript 原生DOM基础没有记牢,心中有点遗憾.下来 ...

  4. Javascript DOM基础(一)概念

    Dom基础概念: <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" ...

  5. Javascript DOM基础(二) childNodes、children

    childNodes知识点: <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Typ ...

  6. javascript DOM基础操作

    DOM(Document Object Model)即文档对象模型,针对HTML和XML文档的API(应用程序接口).DOM描绘了一个层次化的节点树,运行开发人员添加.移除和修改页面的某一部分.DOM ...

  7. Javascript DOM 02 在<ul>中创建、删除 <li>

    创建DOM元素 createElement(标签名)  创建一个节点 appendChild(节点)  追加一个节点 例子:为ul插入li 插入元素 insertBefore(节点, 原有节点)  在 ...

  8. SVG基础以及使用Javascript DOM操作SVG

    SVG 不依赖分辨率 支持事件处理器 最适合带有大型渲染区域的应用程序(比如谷歌地图) 复杂度高会减慢渲染速度(任何过度使用 DOM 的应用都不快) 不适合游戏应用 Canvas 依赖分辨率 不支持事 ...

  9. 第一百一十三节,JavaScript文档对象,DOM基础

    JavaScript文档对象,DOM基础 学习要点: 1.DOM介绍 2.查找元素 3.DOM节点 4.节点操作 DOM(Document Object Model)即文档对象模型,针对HTML和XM ...

随机推荐

  1. Microsoft Dynamics AX 2012: How to get Company,Customer and Vendor address in AX 2012

    Scenario:  “How to get Addresses of “Customer, Vendor and Company” 1)      First we need to identify ...

  2. Strint类成员

    String& String::operator=(const string& other){ if(this == &other) {  return *this; } de ...

  3. GNU/Linux复习笔记(1)

    第一次接触GNU/Linux还是大四上学期实习的那两个月在window里装了 个虚拟机玩红帽的系统,那段时间稍微学了一点命令就不玩了.后来大四下学期认识了王总,装了双系统,那段时间又对linux有了进 ...

  4. hibernate 左链接查询

    select pro from Provide as pro left join pro.labels as la left join pro.city as c where 1=1

  5. PIC32MZ tutorial -- Core Timer

    Core Timer is a very popular feature of PIC32 since it is a piece of the MIPS M4K core itself and is ...

  6. python常用库

    本文由 伯乐在线 - 艾凌风 翻译,Namco 校稿.未经许可,禁止转载!英文出处:vinta.欢迎加入翻译组. Awesome Python ,这又是一个 Awesome XXX 系列的资源整理,由 ...

  7. java小白来报道

    即将开启我的搬码生涯,奋斗吧,少年!

  8. SQL Server 2012 AlwaysOn 亲身实历记

    亲身经历的一个项目,老板忽然提出,对数据库的负债要实施分流,来个数据库一个负责读,而另一个负责写,后台是需要同步两个数据库的状态.找了很多的资料,发现新版的alwayson可以实现这个功能. 研读了a ...

  9. chrome网页重定向

    使用chrome浏览器打开某网页时总会出现错误:此网页包含重定向循环 解决办法: 关闭chrome浏览器, 到你的机器的:C:\Users\username\AppData\Local\Google\ ...

  10. vertica 8.0 新特性

    前言: <<line>> 表明在vertica 8.0文档中的title   正文: 1-支持平台 1.1-操作系统 <<Vertica Server and Ve ...