DOM的理解
https://www.cnblogs.com/djtang/p/11538420.html dom的理解
https://blog.csdn.net/jiuqiyuliang/article/details/13766271 dom的理解
https://www.jianshu.com/p/f65e2610dde1 vue的理解
Windows：打开一个窗口，就是一个Windows对象。
Document：每个窗口的内容就是document，可以进行操作和访问。
DOM：是一种对页面操作的一种标准和规范，能够让开发人员更好的访问和操作数据。英文全称就是 document Object Model 文档对象模型，就是把文档当做对象来进行操作。
获取DOM元素可以通过id选择器，Class名称等方法获取。eg:document.getElementById() document.getElementByClassName()
js中想要修改、移动、删除、添加等操作均需要DOM接口提供方法和属性。
eg:在一个页面中想要想一个p标签中添加内容。用原生js时，需要通过DOM提供的document.getElementById 或者document.getElementByClassName 等方法操作dom元素才可以。而Vue则不需要。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script src="vue.js" type="text/javascript"></script>
</head>
<body>
<div id="app">
<p >{{msg}}</p>
</div>
<script type="text/javascript">
var vm = new Vue({
el:'#app',
data:{
msg:"hellow vue"
}
});
//以下是操作dom元素的写法 需要给p标签一个id
//document.getElementById("qqq").innerHTML = "123"
</script> </body>
</html>
DOM的理解的更多相关文章
- 对dom的理解
js对dom的操作可以理解为: 增.删.改.查 获取对象:查 对象操作:增,修,删 内容操作:innerHTML,innerText等 事件操作:mouse,key 样式操作:id,tag,class ...
- JavaScipt中对DOM的理解
一.理解DOM 浏览器通过文档对象模型DOM使JavaScript程序可以访问页面上的元素,而DOM是页面上XHTML中文档正文标题.段落.列表.样式ID.class以及所有其他出现的数据的一个内部表 ...
- Virtual DOM 虚拟DOM的理解(转)
作者:戴嘉华 转载请注明出处并保留原文链接( #13 )和作者信息. 目录: 1 前言 2 对前端应用状态管理思考 3 Virtual DOM 算法 4 算法实现 4.1 步骤一:用JS对象模拟DOM ...
- 【使用 DOM】理解 DOM
DOM(Document Object Model,文档对象模型)允许我们用 JavaScript 来探查和操作 HTML 文档里的内容.它对于创建丰富性内容而言是必不可少的一组功能. 1. 理解文档 ...
- javascript与DOM -- 深入理解javascript
/* 一.文档对象模型Document Object Model DOM(Document Object Model,文档对象模型)是一个通过和JavaScript进行内容交互的API */ /* 注 ...
- 关于DOM的理解
每个载入浏览器的HTML文档都会生成一个Document对象 Document对象使我们可以从脚本中对HTML中的所有元素进行访问 DOM实际上是以面向对象方式描述的对象模型,它将文档建模为一个个对象 ...
- accp8.0转换教材第7章JavaScript操作DOM对象理解与练习
程序调试,chrome开发人员工具,DOM操作,节点和节点间的关系,节点信息,操作节点,获取元素 一.单词部分 ①alert警告②prompt提示③parentNode父节点④childNode子节点 ...
- javaScript操作DOM深入理解
做为一个web前端,处理和了解浏览器差异一个重要问题.下面将介绍本人在工作中的一些笔记总结,先介绍没有使用js库的情况. 1. setAttribute方法设置元素类名 : 在jQuery中,直接使用 ...
- 第二十四篇:对于dom的理解
好家伙, HTML CSS JS structure style function 结构体 样式 功能 <> ...
随机推荐
- JavaScript解构赋值
JavaScript解构赋值 JavaScript解构赋值为我们提供了很多方便,但是用法比较多,本文就来梳理一下.总体来说,主要就两种地方使用解构赋值,一种是数组的解构赋值,另一种是对象的解构赋值.以 ...
- 黑客整人代码，vbS整人代码大全(强制自动关机、打开无数计算器、无限循环等)
vbe与vbs整人代码大全,包括强制自动关机.打开无数计算器.无限循环等vbs整人代码,感兴趣的朋友参考下.vbe与vbs整人代码例子:set s=createobject("wscript ...
- AtCoder Beginner Contest 163
比赛链接:https://atcoder.jp/contests/abc163/tasks A - Circle Pond 题意 由半径输出圆周长. 代码 #include <bits/stdc ...
- hdu3516 Tree Construction
Problem Description Consider a two-dimensional space with a set of points (xi, yi) that satisfy xi & ...
- __getattr__,__getattribute__和__get__的区别
dir(object) 列出对象的大多数属性 getattr(object, name) 从object对象中获取name字符串指定的属性 hasattr(object, name) 如果objec ...
- 关于markdown的入门使用
关于标题 方式一: 使用 = - 标示一,二级标题 = 表示一级标题 - 表示二级标题 示例: 我展示的是一级标题 ================= 我展示的是二级标题 -------------- ...
- OpenStack Train版-14.安装块存储服务cinder（存储节点）
安装cindoer块存储服务节点(存储节点192.168.0.40)使用默认的LVM卷方法,之后改为ceph存储 安装LVM软件包 [root@cinder01 ~]# yum install lvm ...
- woj1009 最短路 The Legend of Valiant Emigration
title: woj1009 最短路 The Legend of Valiant Emigration date: 2020-03-07 categories: acm tags: [acm,最短路, ...
- HDU - 4455 Substrings（非原创）
XXX has an array of length n. XXX wants to know that, for a given w, what is the sum of the distinct ...
- kmp--考研写法
首先是模式串匹配: #include<iostream> #include<stdlib.h> using namespace std; #define maxn 100000 ...