js备战春招の四のDOM
通过js查找html元素的三种方法:
1、通过id找到html元素。
2、通过标签名找到html元素。
3、通过类名找到html元素。
DOM HTML
document.write(); 直接写入html中
document.getElementById(id).innerHTML=新的html; 修改html中的内容
document.getElementById(id).innerHTML 获取相应id下的镶嵌内容
document.getElementById(id).attribute(这里的attribute是属性的意思,在语法中应该写入相应的属性标签才行,而不是写入attribute)=新属性值; 改变html属性值(包含相应事件分配属性的存在)
document.getElementById(id).onclick=function(){xxxxxx};
onload&onunload事件
onchange事件 <input type="text" id="fname" onchange="upperCase()">
onmouseover&onmouseout
onmousedown&onmouseup
onclick
onfocus
onload
DOM CSS
document.getElementById(id).style.property(这里的意思是选取其中的一个css来写入,后面跟着相应的样式值。)=新样式
visibility:表示元素显示或者隐示,(visible表示出现,hidden表示隐藏)
DOM EventListener
默认值为 false, 即冒泡传递,当值为 true 时, 事件使用捕获传递。
在添加多个时依次添加,而不是一次在addEventlistener
在 冒泡 中,内部元素的事件会先被触发,然后再触发外部元素,即: <p> 元素的点击事件先触发,然后会触发 <div> 元素的点击事件。
在 捕获 中,外部元素的事件会先被触发,然后才会触发内部元素的事件,即: <div> 元素的点击事件先触发 ,然后再触发 <p> 元素的点击事件。
emoveEventListener() 方法移除由 addEventListener() 方法添加的事件句柄:其语法同addEventListener相同。第一个为事件的类型,第二个为接下来事件触发后调用的函数。
创建新的html元素
删除已有的html元素
js备战春招の四のDOM的更多相关文章
- js备战春招の四のjs函数
1.普通函数声明: 2.函数表达式:函数表达式可以存储在变量中,在函数表达式存储在变量后,变量也可作为一个函数使用: 以上函数实际上是一个 匿名函数 (函数没有名称).函数存储在变量中,不需要函数名称 ...
- js备战春招の四の表单
表单验证:required="required"(浏览器自动验证) javascript表单验证: <input id="numb">这条html标 ...
- js备战春招の四の严格模式
JavaScript 严格模式(strict mode)即在严格的条件下运行. use strict 严格模式下你不能使用未申明的变量 "use strict" 指令只运行出现在脚 ...
- js备战春招の四のdevtool中各种错误、调试的使用技巧
try 语句允许我们定义在执行时进行错误测试的代码块. catch 语句允许我们定义当 try 代码块发生错误时,所执行的代码块. JavaScript 语句 try 和 catch 是成对出现的. ...
- js备战春招の四の正则表达式详解
正则表达式语法规则:/正则表达式主体/修饰符(可选)什么是正则表达式:正则表达式是用于匹配字符串中字符组合的模式.在 JavaScript中,正则表达式也是对象.这些模式被用于 RegExp 的 ex ...
- js备战春招の三
DOM (Document Object Model)(文档对象模型)是用于访问 HTML 元素的正式 W3C 标准. window.alert() 弹出警告框. document.write() 方 ...
- 备战春招!开源社区系统 Echo 超全文档助力面试
博主东南大学硕士在读,寒假前半个月到现在差不多一个多月,断断续续做完了这个项目,现在终于可以开源出来了,我的想法是为这个项目编写一套完整的教程,包括技术选型分析.架构分析.业务逻辑分析.核心技术点分析 ...
- CSS备战春招の二
CSS:层叠样式表 CSS注释形式:/* */ class 选择器有别于id选择器,class可以在多个元素中使用 id属性不要以数字开头,以数字开头在特定浏览器中不起作用 类名的第一个字符不要使用 ...
- html备战春招の一
html不是一种编程语言,而是一种标记语言,通过使用标签来标记网页. 对于中文网页需要使用 <meta charset="utf-8"> 声明编码,否则会出现乱码.有些 ...
随机推荐
- Git branch && Git checkout常见用法
https://www.cnblogs.com/qianqiannian/p/6011404.html git branch 和 git checkout经常在一起使用,所以在此将它们合在一起 1.G ...
- VC Edit控件单行垂直居中和定制外框的实现
Edit控件很奇怪,不在WM_PAINT里面画图,且外框也不在WM_NCPAINT里面画,客户区就是整个窗口,非客户区没有.也没有垂直居中风格可以设置.在界面排版的时候,看起来怪怪的. 下面提供Edi ...
- Python_tkinter(3)_grid布局
Grid(网格)布局管理器,是Tkinter里面最灵活的几何管理布局器.注意:不要试图在一个主窗口中混合使用pack和grid. 1.简单的布局 from tkinter import * root ...
- spark1.3.x与spark2.x启动executor不同的cpu core分配方式
***这里的executor在worker上分配策略以spreadOut 为例*** 1.3版本关键点: for (app <- waitingApps if app.coresLeft > ...
- 多线程深入:让你彻底理解Synchronized(转)
原文:https://www.jianshu.com/p/d53bf830fa09 1. synchronized简介 在学习知识前,我们先来看一个现象: public class Synchroni ...
- opencart精简checkout购物流程
最近在做一个商城项目,让外国朋友帮忙看看,他给我们一些建议了,其中他说Can You make more simple buying Button,3 step:Sign up :Shipping A ...
- 导出IndoorGML
导出IndoorGML
- 【Idea】-NO.163.Idea.2 -【How to show the horizontal scroll?】
Style:Mac Series:Java Since:2018-09-10 End:2018-09-10 Total Hours:1 Degree Of Diffculty:5 Degree Of ...
- C# 按不同的字节编码,通过字节数去截取字符串
/// <summary> /// 按不同的字节编码,通过字节数去截取字符串 /// 数据库UTF-8 1个数字.字母.英文符号算1个长度 1个中文.中文符号算3个长度 /// </ ...
- PyTorch常用代码段整理合集
PyTorch常用代码段整理合集 转自:知乎 作者:张皓 众所周知,程序猿在写代码时通常会在网上搜索大量资料,其中大部分是代码段.然而,这项工作常常令人心累身疲,耗费大量时间.所以,今天小编转载了知乎 ...