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. Java 小记 — RabbitMQ 的实践与思考

    前言 本篇随笔将汇总一些我对消息队列 RabbitMQ 的认识,顺便谈谈其在高并发和秒杀系统中的具体应用. 1. 预备示例 想了下,还是先抛出一个简单示例,随后再根据其具体应用场景进行扩展,我觉得这样 ...

  2. springMVC框架+POI组件导出Excel

    目的:访问url(http://localhost:8080/POIOutputExcel/outputexcel.do)实现excel导出,效果图如下: 文件目录(配置文件就不多说了,跟前面的随笔一 ...

  3. python爬虫解决gbk乱码问题

    今天尝试了下爬虫,爬取一本小说,忘语的凡人修仙仙界篇,当然这样不好,大家要支持正版. 爬取过程中是老套路,先获取网页源代码 # -*- coding:UTF-8 -*- from bs4 import ...

  4. 掌握这些回答技术面试题的诀窍,让你offer拿到手软。

    三.四月份,春回大地,万物复苏(请自带赵忠祥老师的BGM),又到了不少同学的跳槽时节. 最近一段时间团队也在招人,这期间筛选了不少简历,面试了一些候选人.这里谈谈我自己的对「怎样回答面试题」的理解. ...

  5. CSS的盒子模型有哪些,区别是什么

    1)盒模型: 内容(content).填充(padding).边界(margin). 边框(border)   2)有两种, IE 盒子模型.标准 W3C 盒子模型:IE的content部分包含了 b ...

  6. hibernate框架学习笔记12:查询优化

    类级别查询优化: 创建一个实体类: package domain; import java.util.HashSet; import java.util.Set; //客户实体 public clas ...

  7. vue计算属性详解——小白速会

    一.什么是计算属性 模板内的表达式非常便利,但是设计它们的初衷是用于简单运算的.在模板中放入太多的逻辑会让模板过重且难以维护.例如: <div id="example"> ...

  8. 福州大学W班-需求分析评分排名

    作业链接 https://edu.cnblogs.com/campus/fzu/FZUSoftwareEngineering1715W/homework/1019 作业要求 1.需求文档 1) 参考& ...

  9. 2017-2018-1 20155205 实现mypwd

    2017-2018-1 20155205 实现mypwd 课堂总结 根据上课对ls -l功能的实现,我总结了实现一个linux命令需要的步骤: 使用man -k xx | grep xx查看帮助文档, ...

  10. 项目Beta冲刺第二天

    1.昨天的困难,今天解决的进度,以及明天要做的事情 昨天的困难:昨天主要是在确认需求方面花了一些时间,后来终于确认了企业自查风险模块的需求问题 今天解决的进度:根据昨天确认下来的需求,我们基本上完成了 ...