DOM

document (html, xml)

object 将文档中的HTML元素转成js的对象

通过ID找到文档的元素转成js对象

var obj = document.getElementById("test");

1. 通用的方式
document.getElementById(id); //通过元素中的唯一的ID
document.getElementsByName(name); //通过元素中的name属性
document.getElementsByTagName(tagname); //通过元素中的标签名称

id的方式, 一个文档中ID是不能重复的, 在一个文档中通过ID只能获取一个对象

而通过文档中元素的name属性和tagname标记名称获取到的元素对象是多个,也就是复数

2. 使用document中的内置数组来完成

model 对元素转成的对象进行操作

1. 内容(使用通用的4个属性) a div b h1 ... <input> 用 value <tag>内容</tag>使用下面4个
innerHTML

innerText 只有IE好用, 非IE不好用(textContent), 不兼容

表单中的内容如何改

<input type="text" name="hello" value="abc">

<areatext></areatext>

属性可以改值, 也可以取值

所有的表单改内容和获取内容都要使用value属性

2. 操作属性

将元素转成对象后, 原来元素有的属性, 就是这个对象的属性
属性可以改值, 也可以取值

3. 操作样式

可以获取样式, 也可以改样式

一、 可以一个一个样式的改

对象.style.样式属性=“样式的值”

样式属性如果有"-"的, 将这个去了, 后面的单词首字母大写

二、 可以批量的改样式
使用className这个通用属性(所有元素都可以使用的属性)

清除样式将className设置为空

关于DOM中的model(将元素转成对象进行操作)的更多相关文章

  1. 如何获取DOM中当前获取焦点的元素

    <script type="text/javascript"> function msg(e) // e = event { var target; //initial ...

  2. 获取表单内元素组装成对象类型,方便datagrid的load取参数

    /** * 获取表单数据,并将其转换为对象 */ function getFormObj(formId) { var formObj = {}; var inputs = $('#'+formId). ...

  3. 095、Java中String类之不自动保存对象池操作

    01.代码如下: package TIANPAN; /** * 此处为文档注释 * * @author 田攀 微信382477247 */ public class TestDemo { public ...

  4. Java&Selenium自动化测试实现页面元素、页面对象及测试代码分离

    一.摘要 本篇博文将介绍自动化测试实现页面元素.页面对象及测试代码分离在自动化框架中的实现 二.解析页面元素定位信息 首先,将页面元素与实际的代码分离,首先我们将页面元素定位信息和定位表达式保存在属性 ...

  5. javascript判断元素存在和判断元素存在于实时的dom中的方法

    今天(周六)下午我在公司加班时不知道要干什么,就打开公司的一个wordpress项目网站,想看下之前自己做的一个网页是否有问题. 打开网站首页,我习惯性的打开了chrome的调试工具,然后鼠标开始滚动 ...

  6. DOM中元素节点、属性节点、文本节点的理解

    DOM中元素节点.属性节点.文本节点的理解 节点信息 每个节点都拥有包含着关于节点某些信息的属性.这些属性是:nodeName(节点名称) nodeValue(节点值) nodeType(节点类型)  ...

  7. DOM中元素对象的属性方法

    在 HTML DOM (文档对象模型)中,每个部分都是节点. 节点是DOM结构中最基本的组成单元,每一个HTML标签都是DOM结构的节点. 文档是一个    文档节点 . 所有的HTML元素都是    ...

  8. 使用jQuery匹配文档中所有的li元素,返回一个jQuery对象,然后通过数组下标的方式读取jQuery集合中第1个DOM元素,此时返回的是DOM对象,然后调用DOM属性innerHTML,读取该元素 包含的文本信息

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  9. js基础之DOM中元素对象的属性方法

    在 HTML DOM (文档对象模型)中,每个部分都是节点. 节点是DOM结构中最基本的组成单元,每一个HTML标签都是DOM结构的节点. 文档是一个    文档节点 . 所有的HTML元素都是    ...

随机推荐

  1. RabbitMQ学习-1补充

    1.如果尝试声明一个已经存在的队列会发生什么? 只要参数完全匹配现存的队列的话,Rabbit什么也不做,并返回成功,就好像这个队列已经创建成功. 2.如何检测队列是否存在? 在创建队列的时候设置que ...

  2. Cassandra Issue with Tombstone

    1. Cassandra is quicker than postgre and have lower change to lose data. Cassandra doesn't have fore ...

  3. swift学习 - tableView自适应高度1(xib autoLayout)

    tableView自适应高度 效果图: 源码: class ViewController: UIViewController,UITableViewDelegate,UITableViewDataSo ...

  4. 4.Java 加解密技术系列之 HMAC

    Java 加解密技术系列之 HMAC 序 背景 正文 代码 结束语 序 上一篇文章中简单的介绍了第二种单向加密算法 — —SHA,同时也给出了 SHA-1 的 Java 代码.有这方面需求的童鞋可以去 ...

  5. 忘记block格式 xib加载没有计算导航栏和tabbar的大小

    敲inlineBlock xib加载没有计算导航栏和tabbar的大小 /将这个属性改为no self.tabBarController.tabBar.translucent = NO; 判断优化,两 ...

  6. Unity游戏程序员面试题及解答

    典型的一些如手写排序算法.一些基本数学问题,在此就不列举了.以下整理出一些代表性的.有参考价值的题,真实面试题,附有本人的解答,欢迎讨论. 题1.指出下列哪些属于值类型? int System.Obj ...

  7. JavaScript Style Guide中文总结

    github原址:https://github.com/airbnb/javascript 类型*基本类型:包括string.number.boolean.null.undefined,存储的是值本身 ...

  8. js实现谷歌坐标转百度坐标

    js实现谷歌坐标转百度坐标 谷歌坐标转百度坐标 实现算法如下(以js为例,其他语言调整就行): //$lat 维度:$lng 经度  function GCJTobaidu($lat, $lng){ ...

  9. ECS_8080端口连接拒绝问题排查

    原文链接 用户ECS网络设置 上图是用户ECS的网络示意图: ecs处于vpc网络下 ecs加入了一个安全组,该安全组出入方向均开放8080端口 ecs有两个网卡,一个私网主网卡(有虚线的网卡),一个 ...

  10. ECMAScript 6.0 简介

    ECMAScript 6.0 在es6中有 许多语法.还有lambda的使用.以及 class 的使用 还有一些新的对象来解决一些事情 可以提高开发效率 但更重要的是 颠覆 javascript 在你 ...