03JavaScript程序设计修炼之道-2019-06-20_20-31-49

## Dom
Document object model 文档对象模型
Dom树
html
|
head body
| |
meta title div
|
ul
|
li li li
在js世界中,把dom树的每个元素都看成一个对象,对象就有属性和方法
dom学什么 dom节点操作 查找元素 元素增删改查 样式操作 事件绑定等
## 事件
三要素 1 事件源 谁身上发生了事件 2 事件 具体的行为 如单击、鼠标悬停、键盘按下...
3 事件处理 事件发生后导致什么结果
唐三藏念紧箍咒 打开电灯
js程序如何处理事件
## 获取页面元素
document.getElementById("**");
document.getElementsByTagName("p");
document.getElementByName()
document.getElementByClassName()
Html5:
document.querySelector()
document.querySelectorAll()
7findEle.html
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge"><title>Document</title>
</head>
<body><p id="foo"></p><div name="foo"></div><ul><li class="demo">111</li><li>222</li><li class="demo">333</li></ul><div class="demo"></div><script>var oDiv = document.getElementsByName("foo");//console.log(oDiv instanceof Object T , Array F);
        oDiv[0].style.color = "blue";// ie9以后才支持var eles = document.getElementsByClassName("demo");console.log(eles.length);//3// querySelector querySelectorAll  H5高版本浏览器常用选择器var p1 = document.querySelector("#foo");console.log(p1);var eles2 = document.querySelectorAll(".demo");console.log(eles2);</script>
</body>
</html>

 

 

转载于:https://www.cnblogs.com/HiJackykun/p/11093730.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/393014.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

linux 独占 cpu,宋宝华:谈一谈Linux让实时 高性能任务独占CPU的事

本文主要讨论在高实时要求、高效能计算、DPDK等领域&#xff0c;Linux如何让某一个线程排他性独占CPU&#xff1b;独占CPU涉及的线程、中断隔离原理&#xff1b;以及如何在排他性独占的状况下&#xff0c;甚至让系统的timer tick也不打断独占任务&#xff0c;从而实现最低的延迟…

linux update语句,MySQL 多表 update sql语句总结

MySQL 多表 update 有几种不同的写法。假定我们有两张表&#xff0c;一张表为Product表存放产品信息&#xff0c;其中有产品价格列Price&#xff1b;另外一张表是ProductPrice表&#xff0c;我们要将ProductPrice表中的价格字段Price更新为Price表中价格字段的80%。在Mysql中我…

linux延时与定时操作

1、at ---系统延迟任务发起命令 at time >command ---任务指令 >ctrld ---发起任务 at -l ---列出延时任务Id at -r id ---删除改id任务 at -m ---让无输出的命令产生邮件 at -M ---让有输…

Windows Server 2008 部署权限管理RMS

1.1 实战&#xff1a;部署权限管理 试验目的&#xff1a; 在单域环境中部署活动目录权限管理服务&#xff0c;实现文档的保护。 试验环境&#xff1a; ? DCServer安装Windows Server 2008企业版&#xff0c;是ess.com的域控制器&#xff0c;安装企业CA。 ? RMSServer安装Wind…

编写一个字节数的rtu C语言校验程序,Modbus通信协议中CRC校验的快速C语言算法

Modbus通信协议中CRC校验的快速C语言算法2004年第11期            福 建 电 脑  63Modbus通信协议中CRC校验的快速C语言算法孟开元(西安石油大学计算机学院陕西西安710065)【摘 要】 本文主要讨论了Modbus通信协议的RTU帧格式中常用的错误校验方法,即循环冗…

如何让CloudStack使用KVM创建Windows实例成功识别并挂载数据盘

问题产生背景&#xff1a; 使用CloudStack KVM组合进行资源池纳管工作&#xff0c;通过ISO镜像文件创建了两个模板&#xff1a; RHEL6U3 64位系统以及WindowsServer2008 R2 SP1 64位系统。然后通过模板创建实例&#xff0c;挂载外接存储&#xff0c;实例启动后&#xff0c;通过…

云计算openstack介绍

转载于:https://www.cnblogs.com/WIU1905/p/11107593.html

**加密解密基础、PKI及SSL、创建私有CA**

进程间通信 socket通信 客户端-->请求--> 路由转发 --> 服务端&#xff0c;取出资源 --> 封装为可响应给客户端的请求报文从接收请求端口发出 SSL/TLS协议的实现 OpenSSL OpenSSL程序组件 1234[rootlocalhost CA]# rpm -ql openssl /usr/lib/libcrypto.so.10 //加…

5.3 上午

观看英语课程——《恋练有词》 学习Linux 转载于:https://www.cnblogs.com/bgd140206110/p/6801164.html

mysql索引随记

为什么80%的码农都做不了架构师&#xff1f;>>> 先了解下Btree&#xff1a;https://my.oschina.net/u/3646190/blog/1593094 为什么每个数据项&#xff0c;即索引字段要尽量的小&#xff0c;比如int占4字节&#xff0c;要比bigint8字节少一半&#xff1f; 通过上面…

c语言写桌面程序unity,Unity和iOS原生界面交互示例

注意上面的Main方法中出现的UnityAppController&#xff0c;该类就是作为控制类来实现Unity在iOS上显示的功能&#xff0c;在Main方法中就是将该控制器作为参数传递&#xff0c;即Main方法之后就会进入该类执行。所以这是我们进入到UnityAppController.mm&#xff0c;来查看该类…

浏览器中插入富文本编辑器

常用的富文本编辑器有CKEditor、UEEditor、TinyEditor、KindEditor等、以下以kindeditor编辑器的使用为例。 1.官网下载KindEditor编辑器http://kindeditor.net/down.php&#xff0c; 当前最新版本为4.1.11&#xff0c;解压缩后放入项目的static目录&#xff0c;作为js插件引用…

获取Extjs文本域中的内容

经常在Ext.select()和Ext.query()等问题上纠结&#xff0c;今天终于有了点新认识&#xff1a; 需求&#xff0c;假设我们的页面上有个panel ,其id为clusterstab_edit_details,这个panel的内部有个textarea,这个textarea的name为editDetails_Description,那么我们有多少方法可以…

Asp.NetCoreWebApi - RESTful Api

REST 常用http动词 WebApi 在 Asp.NetCore 中的实现3.1. 创建WebApi项目.3.2. 集成Entity Framework Core操作Mysql 3.2.1. 安装相关的包(为Xxxx.Infrastructure项目安装)3.2.2. 建立Entity和Context3.2.3. ConfigureService中注入EF服务3.2.4. 迁移数据库3.2.5. 数据库迁移结果…

android动画影子效果,Android TV常用动画的效果,View选中变大且有阴影(手机也能用)...

因为电视屏幕比较大&#xff0c;而我们看电视时距离电视有一定距离&#xff0c;这样就需要动画效果比较明显&#xff0c;这个动画就是应用最广泛的&#xff0c;因为很酷&#xff0c;呵呵&#xff0c;你懂得&#xff0c;看了就知道。效果如下图&#xff1a;public class MainAct…

linux 高可用----keepalived+lvs

什么是高可用&#xff1f; HA&#xff08;high availability&#xff09;即高可用性&#xff1b;就是在高可用集群中发生单点故障时&#xff0c;能够自动转移资源并切换服务&#xff0c;以保证服务一直在线的机制。 LVS LVS&#xff1a;&#xff08;linux virtual server&#…

用户配置相关文件

用户配置相关文件小总结 /etc/passwd 记录用户相关的信息 /etc/shadow 密码影子文件 /etc/group 记录用户组相关的信息 /etc/gshadow 密码影子文件&#xff08;组密码&#xff09; /etc/passwd 文件中各段的内容 第1段&#xff1a;用户名 第…

华为5c android n风格,华为荣耀畅玩5C的屏幕怎么样

华为荣耀畅玩5C的屏幕怎么样屏幕方面&#xff0c;华为荣耀畅玩5C采用了5.2英寸1080P级别GFF贴合屏幕&#xff0c;塑料边框采用了弧面状的设计&#xff0c;握感比较舒适。华为荣耀畅玩5C采用了双主天线的设计&#xff0c;分别在上下的塑料区域。此外&#xff0c;边框以及后盖的上…

spring解析配置文件(三)

一、从XmlBeanDefinitionReader的registerBeanDefinitions&#xff08;doc,resource&#xff09;开始 1 protected int doLoadBeanDefinitions(InputSource inputSource, Resource resource) 2 throws BeanDefinitionStoreException { 3 try { 4 …

使用kibana和elasticsearch日志实时绘制图表

前言&#xff1a; 此文接的是上篇&#xff0c;上次的内容是&#xff0c;用python操作elasticsearch存储&#xff0c;实现数据的插入和查询。 估计有些人一看我的标题&#xff0c;以为肯定是 logstash kibana elasticsearch的组合。这三个家伙也确实总是勾搭在一块。 其实logst…