DOM Access and Manipulation JS 操纵DOM
JS 操纵DOM 有两种很简单的方式:
如果知道ID 的情况下. 我们可以使用 document.getElementById
我们还可以使用
document.getElementById("testId").textContent = "0";
document.querySelector(".testClass").classList.toggle("active");
我们还可以把function赋值到event listener中.
Ps: 这里是赋值, 而不是调用. 如果调用init, 应该是init()
document.querySelector(".btn-new").addEventListener("click",init);
function init() {
console.log("HelloWorld!");
}
我们还可以生成click event handler 来监听click.
document.querySelector(".btn-test").addEventListener("click", function() {
console.log("HelloWorld!");
});
我们可以在MDN查看到所有的event listener 事件
DOM Access and Manipulation JS 操纵DOM的更多相关文章
- JavaScript学习笔记(三)——留言板知操纵DOM节点
用JavaScript写了一个简易的留言板,暂不涉及数据库接入等. 1.功能以及流程 主要功能即为留言,用两个文本框接受用户输入的用户名以及留言内容,然后通过"提交留言"按钮将用户 ...
- js的dom测试及实例代码
js的dom测试及实例代码 一.总结 一句话总结: 1.需要记得 创建 标签和创建文本节点都是document的活:document.createTextNode("Rockets的姚明&q ...
- 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 ...
- Virtual DOM 系列一:认识虚拟DOM
1. 什么是Virtual DOM? Virtual DOM(虚拟DOM)是指用JS模拟DOM结构.本质上来讲VD是一个JS对象,并且至少包含三个属性:tag(html标签),props(标签的属性, ...
- jQuery操纵DOM元素属性 attr()和removeAtrr()方法使用详解
jQuery操纵DOM元素属性 attr()和removeAtrr()方法使用详解 jQuery中操纵元素属性的方法: attr(): 读或者写匹配元素的属性值. removeAttr(): 从匹配的 ...
- load/domContentLoaded事件、异步/延迟Js 与DOM解析
一.DOMContentLoaded 与 load事件 关于load和DOMContentLoaded事件,mdn对于它们是这样描述的: DOMContentLoaded mdn文档地址:https: ...
- js的DOM对象
1.js的Array对象 ** 创建数组(三种) - var arr1 = [1,2,3]; ...
- 高效率http页面优化法则一【JS对DOM的操作】
高效http页面优化法则一很多人都认为JS的效率太慢了,都不愿意用js来实现相对困难一点的程序逻辑.在这里我要说的是其实js的效率并不慢,慢的是DOM,如果操作好DOM,你的js效率将提高接近千倍(这 ...
随机推荐
- DevExpress v18.1新版亮点——Office File API篇
用户界面套包DevExpress v18.1日前正式发布,本站将以连载的形式为大家介绍各版本新增内容.本文将介绍了DevExpress Office File API v18.1 的新功能,快来下载试 ...
- [Paper] LCS: An Efficient Data Eviction Strategy for Spark
Abstract Classical strategies do not aware of recovery cost, which could cause system performance de ...
- TextRank算法
TextRank是一种用来做关键词提取的算法,也可以用于提取短语和自动摘要.因为TextRank是基于PageRank的,所以首先简要介绍下PageRank算法. (1)PageRank PageRa ...
- linux下关于PCL(point cloud library)库的安装,三行命令错误的问题
最近想再看看PCL,所以进行了安装,在之前的接触的过程中,由于之前的网络存在问题,导致以下三个命令: sudo add-apt-repository ppa:v-launchpad-jochen-sp ...
- SpringSecurity自定义登陆页面和跳转页面
如果我们不用form-login说明登陆界面,springsecurity框架将自动为我们生成登陆界面 现在我们不想用自动生成的登陆界面了,而想使用自定义的漂亮的登陆界面 则需要使用<secur ...
- python scrapy 数据处理时间格式转换
def show(self,response): # print(response.url) title = response.xpath('//main/div/div/div/div/h1/tex ...
- to linux
apt-get update // 更新 apt sudo apt-get install git // 安装git git clone git://github.com/yyuu/pyenv.git ...
- Oracle流程控制语句
1.选择语句 1.1 IF...THEN...END IF语句 DECLARE MY_AGE INT; IF MY_AGE IS NULL THEN DBMS_OUTPUT.put_line('AGE ...
- centos6.5 vncserver
yum install tigervnc tigervnc-server -y vncserver 又叫tigervnc 2.配置 vncserver vim /etc/sysconfig/vncse ...
- Linux 下各个目录的作用及内容
在 Linux 下,我们看到的是文件夹(目录): 在早期的 UNIX 系统中,各个厂家各自定义了自己的 UNIX 系统文件目录,比较混乱.Linux 面世不久后,对文件目录进行了标准化,于1994年对 ...