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. Angular开发实践(六):服务端渲染

    Angular Universal Angular在服务端渲染方面提供一套前后端同构解决方案,它就是 Angular Universal(统一平台),一项在服务端运行 Angular 应用的技术. 标 ...

  2. 如何使用 RESTClient 调试微信支付接口

    我们知道微信支付使用http协议进行api调用,body 使用xml格式,使用的一般http在线调试工具,无法进行xml数据的post. RESTClient 做的很好,支持各种http 方法,bod ...

  3. beta冲刺2-咸鱼

    q前言:今天晚上大概把github的的相关东西弄上了.然后把之前做的一些修改什么的也上传上去了.目测之后的话就是在自己这边改完然后直接上github那边去复制粘贴替换掉了. 昨天的问题:github这 ...

  4. Beta No.3

    今天遇到的困难: 组员对github极度的不适应 github的版本控制和协同化编程确实操作起来需要一定的熟练度,我们缺乏这种熟练度 Android Studio版本不一致项目难以打开的问题仍然无法解 ...

  5. 每日冲刺报告——Day4(Java-Team)

    第四天报告(11.5  周日) 团队:Java-Team 成员: 章辉宇(284) 吴政楠(286) 陈阳(PM:288) 韩华颂(142) 胡志权(143) github地址:https://git ...

  6. socketpair创建双向通信的管道(全双工通信)

    Linux下socketpair介绍: socketpair创建了一对无名的套接字描述符(只能在AF_UNIX域中使用),描述符存储于一个二元数组,例如sv[2] .这对套接字可以进行双工通信,每一个 ...

  7. 【iOS】swift-通过JS获取webView的高度

     let webHeightStr = webView.stringByEvaluatingJavaScriptFromString("document.body.scrollHeight& ...

  8. Node入门教程(5)第四章:global 全局变量

    global - 全局变量 全局对象(global object),不要和 全局的对象( global objects )或称标准内置对象混淆.这里说的全局的对象是说在全局作用域里的内的对象.全局作用 ...

  9. HTML事件处理程序

    事件处理程序中的代码执行时,有权访问全局作用域中任何代码. //为按钮btn_event添加了两个个事件处理程序,而且该事件会在冒泡阶段触发(最后一个参数是false). var btn_event ...

  10. Linux "零拷贝" sendfile函数中文说明及实际操作

    Sendfile函数说明 #include ssize_t sendfile(int out_fd, int in_fd, off_t *offset, size_t count); sendfile ...