查找元素

根据id找

document.getElementById("b");

根据class找

document.getElementsByClassName("aa")

class返回的是数组,需要一个变量来接受使用

根据name找,用于表单元素

document.getElementsByName("cc")[0]

返回的是一个NodeList,不是数组,但是有length属性,可以索引取值,但是不能用push和pop方法,可以通过for循环遍历出来,再赋值给一个数组。

根据元素找

document.getElementsByTagName("div")

操作内容

普通元素

var a = document.getElementById("a");

1.获取内容文本
a.innerText;

2.赋予内容
a.innerText = "ok";

3.获取内容代码
a.innerHTML;

4.设置内容
a.innerHTML = "<span style='color:red'>ok</span>";

5.显示出标签
a.innerText = "<a href='#'>超链接</a>";

表单元素
var a = document.getElementById("txt");

获取value值

a.value;

赋予value值

a.value = "ok";

操作属性

1.添加属性
a.setAttribute("checked","checked");
2.移除属性
a.removeAttribute("checked");
3.获取属性
a.getAttribute("属性");

操作样式

var a = document.getElementById("d");

1.获取样式,只能获取内嵌的
a.style.样式;

2.设置样式
a.style.fontSize = "30px";

3.修改样式
a.style.backgroundColor = "green";
a.style.color="white";

js DOM对象的更多相关文章

  1. JS DOM对象控制HTML元素详解

    JS DOM对象控制HTML元素详解 方法: getElementsByName()  获取name getElementsByTagName()  获取元素 getAttribute()  获取元素 ...

  2. JS & DOM 对象

    22:36 2013/6/4 详情参照W3C文档标准 Browser 对象(顶层对象) DOM Window DOM Navigator DOM Screen DOM History DOM Loca ...

  3. 2018-06-19 js DOM对象

    DOM对象: Doucument Object Model即文档对象 DOM对象的操作: 1.找元素 返回元素对象: var obj=document.getElementById();//通过Id查 ...

  4. 引用 1.9.1.min.js dom对象 没有live 绑定事件方法, 引用 1.7.js 就有live 绑定事件方法

    问题:相同环境,引用 1.9.1.min.js $('div[data-role="page"]').live('pagehide', function (event, ui) { ...

  5. js Dom对象的属性与方法

    1.对象集合:      (1).all[];      (2).images[];      (3).anchors[];      (4).forms[];      (5).links[];   ...

  6. JS DOM对象与jQuery对象的转换

    JS转jQuery // 直接用$()来包裹 如同$(this) $(document) var jsObj = document.getElementById('test'); var jquery ...

  7. 2018-06-24 js BOM对象

    BOM对象: Browser Object Model 即浏览器对象模型: 包含: window:窗口对象 alert();//警示框 confirm();//确认框 prompt();//输入提示框 ...

  8. 如何判断一个js对象是否一个DOM对象

    我们在写js代码时有时需要判断某个对象是不是DOM对象,然后再进行后续的操作,这里我给出一种兼容各大浏览器,同时又算是比较稳妥的一种方法. 要判断一个对象是否DOM对象,首先想到的无非就是它是否具有D ...

  9. js的DOM对象

    1.js的Array对象           ** 创建数组(三种)                          - var arr1 = [1,2,3];                    ...

随机推荐

  1. Android Studio日志工具的使用

    Android Studio的LogCat工具 Verbose:对应Log.v(),这个方法用于打印那些最为琐碎的信息,意义最小的日志信息.是Android日志里面级别最低的一种. Debug:对应L ...

  2. 怎样将runlmbench 获取的数值传给上层app

    前面那个随笔 , 已经成功将runlmbench 移植到了Android , 并成功的运行. 今天就写一下将runlmbench 获取的那些性能值传给上层 App 进行人机交互. 一开始 , 我是想直 ...

  3. linux下QtCreator无法输入中文的情况

    解决linux下QtCreator无法输入中文的情况 本文由乌合之众 lym瞎编,欢迎转载 blog.cnblogs.net/oloroso 本文由乌合之众 lym瞎编,欢迎转载 my.oschina ...

  4. Configuration

    package edu.fzu.ir.util; import java.io.File; import java.io.FileInputStream; import java.io.FileNot ...

  5. Apache Thrift 环境配置

    在 Ubuntu 14.04 下Apache Thrift 的安装方法: 1安装依赖包 sudo apt-get install libboost-dev libboost-test-dev libb ...

  6. centos7 & mysql

    首先centos7很坑爹. 其次,在centos7上安装mysql更坑爹. 特此记录一次坑爹历程后的唯一出路. 安装mysql wget http://repo.mysql.com/mysql-com ...

  7. JavaScript基础介绍

    JavaScript组成 •ECMAScript:解释器.翻译 •DOM:Document Object Model •BOM:Browser Object Model –各组成部分的兼容性,兼容性问 ...

  8. No handlers could be found for logger "keystoneauth.identity.generic.base"

    一般是因为发现了多个keystone的url造成的.

  9. silverlight 获取服务器上图片出现异常 “AG_E_NETWORK_ERROR”

    前言 之前项目一直是发布在IIS上面使用HTTP访问,现在要求改为HTTPS,通过在IIS生成自签名后,打开HTTPS通道,可以将原来的程序已HTTPS的方式发布出来. 可参见 http://blog ...

  10. 【leetcode】Wildcard Matching

    Wildcard Matching Implement wildcard pattern matching with support for '?' and '*'. '?' Matches any ...