dom操作

1、找到元素(标签对象)

  标签名:

    document.getElementsByTagName()[];  //返回的是数组类型,需要有下标来找内容

  属性:

    document.getElementById();  //id属性值

    document.getElementsByName()[];  //name属性值  返回的是数组类型,需要有下标来找内容

    document.getElementsByClassName()[];  //class属性值

2、操作元素

  操作内容:

    非表单元素:

      标签对象.innerHTML  //获取标签内容

      标签对象.innerHTML = 内容  //修改标签内容

    表单元素:

      标签对象.value  //获取标签内容

      标签对象.value = 内容  //修改标签内容

    操作属性:

      标签对象.getAttribute("属性名")   //获取标签属性值

      标签对象.setAttribute("属性名","属性值")  //设置标签属性值

    操作样式:

      标签对象.style.color   //获取标签样式值

      标签对象.style.color = "red";  //设置标签样式值,要带双引号

0323-DOM基础操作的更多相关文章

  1. JavaScript DOM 基础操作

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

  2. JavaScript学习 - 基础(六) - DOM基础操作

    DOM: DOM定义了访问HTML 和XML 文档的标准:1.核心DOM 针对结构化文档的标准模型2.XMK DOM 针对XML文档的标准模型3.HTML DOM 针对HTML文档的标准模型 DOM节 ...

  3. javascript DOM基础操作

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

  4. jQuery~DOM基础操作

    操作DOM 1.什么是DOM:document object model文档对象模型 2.树形结构 3.什么是节点(node):DOM结构中最小单位,元素.文本.属性...创建节点 var $div ...

  5. DOM基础操作实战代码

    对于已经讲解给大家的DOM实战,我今天给大家几个实战代码,可以让大家加深对此的理解! 1.用DOM动态生成这样一个结构: <div class=”example”> <p class ...

  6. DOM基础操作(三)

    DOM剩余的两个操作一并带来! 1.删除操作 removeChild 这个方法依然是父级调用的,参数就是要删除的子节点,其实实际上是剪切,这个方法会把我们删除掉的元素给返回,我们可以用一个变量去保存这 ...

  7. DOM基础操作(二)

    插入操作 1.appendChild(child); 这个是父级调用的方法,它会将child元素插入到父级里面,而且是放到逻辑后面的位置上.   div.appendChild(comment);   ...

  8. DOM基础操作(一)

    DOM的基本操作有四种,我们会逐一给大家进行展示 增加操作 1.创建元素节点 createElement 我们可以通过document.createElement(‘div’);这个方法来创建一个元素 ...

  9. DOM基础操作

    本文地址:http://www.cnblogs.com/veinyin/p/7606972.html  1 访问 HTML 元素 常用方法 document.getElementById(" ...

  10. DOM基础及DOM操作HTML

     文件对象模型(Document Object Model.简称fr=aladdin" target="_blank">DOM).是W3C组织推荐的处理可扩展标 ...

随机推荐

  1. 浅谈new/delete和malloc/free的用法与区别

    每个程序在执行时都会占用一块可用的内存空间,用于存放动态分配的对象,此内存空间称为自由存储区或堆. 一.new和delete用法 如下几行代码: int *pi=new int; int *pi=ne ...

  2. Struct_2路径问题

    今天在自学那个Struct2的知识点的时候,发现那个相对路径和绝对路径有点遗忘.特地去看了视频还有在百度上查了一些资料.我觉得这个路径问题对于我这个初学者来说还是有点容易遗忘的.所以,今天就添加这个新 ...

  3. 巨人大哥谈Java中的Synchronized关键字用法

    巨人大哥谈Java中的Synchronized关键字用法 认识synchronized 对于写多线程程序的人来说,经常碰到的就是并发问题,对于容易出现并发问题的地方价格synchronized基本上就 ...

  4. JavaScript(第九天)【正则表达式】

    假设用户需要在HTML表单中填写姓名.地址.出生日期等.那么在将表单提交到服务器进一步处理前,JavaScript程序会检查表单以确认用户确实输入了信息并且这些信息是符合要求的.   一.什么是正则表 ...

  5. WebSocket 聊天室加自制服务器

    自动监听本地ip 占用端口9930 打开服务器 再打开页面 输入服务器监听的ip和端口 局域网可以输入内网ip 外网连接 要输入服务器的外网ip 路由器需做好映射 实现WebSocket通信功能  和 ...

  6. Python 线程复习

    修改全局变量,设立flag来避免线程间数据冲突,低效率版 from threading import Thread import time g_num=0 g_flag = 1 def test1() ...

  7. Flask 学习 十一 关注者

    数据库关系 1.1多对多关系 添加第三张表(关联表),多对多关系可以分解成原表和关联表之间的两个一对多的关系 多对多仍然使用db.relationship()方法定义,但是secondary参数必须设 ...

  8. EasyUI 中datagrid 分页。

    注释:datagrid分页搞了好几天才完全搞好,网上没完全的资料.明天晚上贴代码. 睡觉.

  9. Ubuntu 17.10.1安装, 定制

    p { margin-bottom: 0.25cm; line-height: 120% } a:link { } 2018.4.7 Ubuntu 17.10.1安装, 定制, 后续搭建LAMP环境 ...

  10. dubbo debug过程中一个有趣的问题

    最近在debug dubbo代码过程中遇到的很有趣的问题 我们都知道dubbo ReferenceBean是消费者的spring bean包装,为了查一个consumer端的问题,在Reference ...