JS的DOM操作及动画
JS的DOM操作
DOM:Document Object Model
BOM:Bowers(浏览器) Object Model
找到元素:var a=document.getElementById("id") ;就找到的元素放在变量中;
id选择器:document.getElementById("id"); 根据id找,最多找一个;
class选择器:document.getElementClassName("name") ;根据classname找,找出的是数组;
标签选择器:document.getElementTagName("name");根据标签名找,找出的是数组;
name选择器:document.getElementByName("name");根据name找,找出的是数组;
操作内容:innerHTML 标签里的代码和文字都获取;
innerText 只能取文字;
操作属性:var a=document.getElementById("id");
a.setAttribute("属性名","属性值") ;设置一个属性,可以添加或者更改;
a.getAttribute(“属性名”);获取属性的值;
a.removeAttribute(“属性名”);移除一个属性;
操作样式: a.style.样式=“”;
动画
CSS 过渡(渐变效果)
JS setInterval
clearInterval
createElement:
var op = createElement("标签名")
op.属性
appendChild:appendChild(对象名) :即op
removeChild
onchange : 改变事件
JS的DOM操作及动画的更多相关文章
- JS的DOM操作语法
整理了一下JS的DOM操作语法,这里做下记录. <!DOCTYPE html> <html> <head> <meta charset="utf-8 ...
- js的dom操作(整理)(转)
js的dom操作整理(整理)(转) 一.总结 一句话总结: dom操作有用原生js的dom操作,也可以用对js封装过的jquery等插件来来更加方便的进行dom操作 1.dom是什么? 对于JavaS ...
- js的DOM操作整理(整理)
js的DOM操作整理(整理) 一.总结 一句话总结: dom操作有用原生js的dom操作,也可以用对js封装过的jquery等插件来更加方便的进行dom操作 1.dom是什么? 对于JavaScrip ...
- JS的DOM操作 - 你真的了解吗?
摘要 想稍微系统的说说对于DOM的操作,把Javascript和jQuery常用操作DOM的内容归纳成思维导图方便阅读,同时加入性能上的一些问题. 前言 在前端开发的过程中,javascript极为重 ...
- 原生js封装dom操作库
var utils = (function(window) { var flag = "getComputedStyle" in window; function win(attr ...
- 5月16日上课笔记-js中DOM操作
一.DOM操作 DOM节点的操作 增加 删除 修改 节点的信息: nodeName 获取节点的标签名 parentNode 获取父节点 childNodes IE忽略回车换行,chrome回车换行是文 ...
- js函数 DOM操作
回学校了两天请了两天假,数组和方法的内容周末一定补上! 今天介绍一下JavaScript函数 Function 一.基础内容 1.定义 函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块. f ...
- 总结js常用的dom操作(js的dom操作API)
转载:https://www.haorooms.com/post/js_dom_api 前言 很多同学用惯了jquery操作dom,让他们用js操作的时候,常常力不从心,本文总结了常用的js的dom操 ...
- js常用DOM操作
在博客园看到了苏夏写的常用DOM整理文章,地址:http://www.cnblogs.com/cabbagen/p/4579412.html,然后抽时间都试了一下这些常用的DOM操作.在这里记录一下. ...
随机推荐
- LINQ查询表达式基础
LINQ,语言集成查询(Language Integrated Query)是一组用C#和Visual Basic语言的扩展. 对于编写查询的开发人员来说,LINQ 最明显的"语言集成&qu ...
- 关于Test--Pattern Generator IP核的测试
关于Test--Pattern Generator IP核的测试 1.Test--Pattern Generator 功能介绍 生成24-bit RGB视频流,此IP核可以用于系统测试,不需要先在片上 ...
- SpringMVC:学习笔记(1)——理解MVC及快速入门
SprigMVC-理解MVC及快速入门 说明: 传统MVC-->JSPModel2-->Front Controller + Application Controller + Page C ...
- SaberRD之瞬态分析
瞬态分析(Transient Analysis)也叫做暂态分析,一般用于分析含有储能器件的电路在换路后发生的过渡状态,比如分析RLC电路在接通.断开.改接以及参数发生改变和电源突变时,电路的电压电流从 ...
- gstunnel---一个网络安全管道
项目简介: gstunnel 是 基于go 语言开发的一个安全网络管道,支持tcp协议. gstunnel分为client和server两部分. gstunnel 基于aes进行数据加密. 流程示意: ...
- webpack(四)处理 css\less\sass 样式
(一) 处理普通的.css 文件,需要安装 css-loader,style-loader .less 文件,需要安装 less-loader .sass 文件,需安装 less-loader np ...
- 从零开始搭建Salt Web之封装salt-api接口
salt-api现在已经正常运行,接下来则是实现通过调用salt-api来执行salt命令. 调用salt-api执行命令时,记得携带c_path参数 因为salt中自带了tornado这个库,所以决 ...
- struts2.5新配置动态调用
开启动态调用: <constant name="struts.enable.DynamicMethodInvocation" value="true"/& ...
- ABP入门系列(13)——Redis缓存用起来
ABP入门系列目录--学习Abp框架之实操演练 源码路径:Github-LearningMpaAbp 1. 引言 创建任务时我们需要指定分配给谁,Demo中我们使用一个下拉列表用来显示当前系统的所有用 ...
- linux网络编程1 最简单的socket编程
下面是socket编程的服务器端 先看一个图,1 #include<stdio.h> #include<stdlib.h> #include<string.h> # ...