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;从而实现最低的延迟…

leetcode347. 前 K 个高频元素(排序)

给定一个非空的整数数组&#xff0c;返回其中出现频率前 k 高的元素。 示例 1: 输入: nums [1,1,1,2,2,3], k 2 输出: [1,2] 示例 2: 输入: nums [1], k 1 输出: [1] 代码 class Solution {public int[] topKFrequent(int[] nums, int k) {Map<Integer,Integer>…

如何在React中从其父组件更改子组件的状态

by Johny Thomas约翰尼托马斯(Johny Thomas) 如何在React中从其父组件更改子组件的状态 (How to change the state of a child component from its parent in React) We will be building a simple React app which shows the real name of a superhero on a button click.我们…

vue-property-decorator 提供 OO 的风格 Vue Component 方便类型声明

Prop 父子组件之间传值 Install: npm install --save vue-property-decoratorChild: <template><div>{{fullMessage}}</div> </template><script lang"ts">import Vue from vue import {Component, Prop} from vue-property-decorato…

python学习笔记(1)

变量的命名 变量名只能包含字母、数字、下划线&#xff0c;不能以数字打头不要用Python关键字、函数名、保留用于特殊用途的单词作变量名变量名应短且有描述性慎用小写l和大写O字符串 就是一系列字符 在Python中&#xff0c;用引号扩起的都是字符串&#xff0c;引号可以是单引号…

使用这些HTTP标头保护您的Web应用程序

by Alex Nadalin通过亚历克斯纳达林 使用这些HTTP标头保护您的Web应用程序 (Secure your web application with these HTTP headers) This is part 3 of a series on web security: part 2 was “Web Security: an introduction to HTTP”这是有关Web安全的系列文章的第3部分&…

leetcode547. 朋友圈(并查集)

班上有 N 名学生。其中有些人是朋友&#xff0c;有些则不是。他们的友谊具有是传递性。如果已知 A 是 B 的朋友&#xff0c;B 是 C 的朋友&#xff0c;那么我们可以认为 A 也是 C 的朋友。所谓的朋友圈&#xff0c;是指所有朋友的集合。 给定一个 N * N 的矩阵 M&#xff0c;表…

linux ssh Unused,安装openssh-portable时遇到的问题及解决办法

问题1&#xff1a;configure: error: Your OpenSSL headers do not match yourlibrary. Check config.log for details.If you are sure your installation is consistent, you can disable the checkby running “./configure –without-openssl-header-check”.Also see cont…

windows 删除删除不掉的文件

DEL /F /A /Q \\?\%1RD /S /Q \\?\%1 windows下删除删除不掉的文件&#xff1a; 1、打开记事本&#xff0c;把上面的命令复制进去 2、保存&#xff0c;后缀名改为.bat&#xff0c;ok 3、把想要删除的文件托放到这个文件的图标上 转载于:https://www.cnblogs.com/Mike_Chang/p…

云计算技术的跃进睿云智合专业先进水平

对于未来的云计算数据中心&#xff0c;网络虚拟化方案需要适应计算和存储虚拟化的浪潮&#xff0c;快速的实现云计算业务的发放&#xff0c;以及能够满足动态的应用程序工作负载的需求;同时需要帮助管理员更简单的管理物理网络和虚拟网络&#xff0c;实现网络可视化。睿云智合&…

CSS 选择器权重计算规则

CSS 选择器&#xff08;Selector&#xff09;的权重&#xff08;Specificity&#xff09;决定了对于同一元素&#xff0c;到底哪一条 CSS 规则会生效。且仅有当多条 CSS 规则都对同一元素声明了相应样式时&#xff0c;才会涉及到权重计算的问题。 选择器的分类 正式计算选择器权…

本地构建和自动化构建_如何构建最强大,最安全的家庭自动化系统

本地构建和自动化构建by Amir Off由Amir Off 如何构建最强大&#xff0c;最安全的家庭自动化系统 (How to build the most robust and secure home automation system) In this article, I’ll discuss how I built a Smart Home Automation System with Angular and Node.js …

leetcode990. 等式方程的可满足性(并查集)

给定一个由表示变量之间关系的字符串方程组成的数组&#xff0c;每个字符串方程 equations[i] 的长度为 4&#xff0c;并采用两种不同的形式之一&#xff1a;“ab” 或 “a!b”。在这里&#xff0c;a 和 b 是小写字母&#xff08;不一定不同&#xff09;&#xff0c;表示单字母…

random对文件随机重命名

对文件随机重命名&#xff0c;这个用途可广了&#xff0c;大家可以想想 echo off setlocal ENABLEDELAYEDEXPANSION for /r %%a in (*.txt) do ( set c!random! ren %%~dpnsa.txt !c!.txt) pause 本文转自sucre03 51CTO博客&#xff0c;原文链接&#xff1a;http://blog…

AC日记——Periodic RMQ Problem codeforces 803G

G - Periodic RMQ Problem 思路&#xff1a; 题目给一段序列&#xff0c;然后序列复制很多次&#xff1b; 维护序列很多次后的性质&#xff1b; 线段树动态开点&#xff1b; 来&#xff0c;上代码&#xff1a; #include <cstdio> #include <cstring> #include <…

数据之路 - Python爬虫 - 数据存储

一、文件存储 1.文件打开方式 文件打开方式说明r以只读方式打开文件。文件的指针将会放在文件的开头。这是默认模式rb以二进制只读方式打开一个文件。文件指针将会放在文件的开头r以读写方式打开一个文件。文件指针将会放在文件的开头rb以二进制读写方式打开一个文件。文件指针…

创建react应用程序_如何使用React创建一个三层应用程序

创建react应用程序Discover Functional JavaScript was named one of the best new Functional Programming books by BookAuthority!“发现功能JavaScript”被BookAuthority评为最佳新功能编程书籍之一 &#xff01; Splitting a Single Page Application into layers has a …

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修改PowerShell(命令提示符)默认中文编码方式

如果以下方法都没有作用的话&#xff0c;可以直接在代码中调用<stdlib.h>中的system("mode con cp select65001")或者是system("chcp 65001")。当然&#xff0c;前提是你用的也是C、C、C#等强类型编程语言。 **************************************…