From 8da489ee19c8404e76d58eca550090e54cb83557 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=8E=8B=E4=BB=B0=E6=96=87?= <1071588432@qq.com>
Date: Mon, 31 May 2021 21:53:24 +0800
Subject: [PATCH] =?UTF-8?q?5=E6=9C=8829=E6=97=A5=E7=9A=84=E7=AC=94?=
 =?UTF-8?q?=E8=AE=B0Vue?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../note-2021-05-29.md"                       | 124 ++++++++++++++++++
 1 file changed, 124 insertions(+)
 create mode 100644 "\347\216\213\344\273\260\346\226\207/note-2021-05-29.md"

diff --git "a/\347\216\213\344\273\260\346\226\207/note-2021-05-29.md" "b/\347\216\213\344\273\260\346\226\207/note-2021-05-29.md"
new file mode 100644
index 0000000..3639f2f
--- /dev/null
+++ "b/\347\216\213\344\273\260\346\226\207/note-2021-05-29.md"
@@ -0,0 +1,124 @@
+# 大二第二学期课堂笔记
+
+### Description
+课堂笔记 2021-05-29
+
+### Content
+
+1. 文本和原始HTML
+```
+用户输入的内容不要用 v-html 来绑定，很危险，容易遭受 XSS 的攻击。
+
+通过使用 v-once 指令，你也能执行一次性地插值，当数据改变时，插值处的内容不会更新。但请留心这会影响到该节点上的其它数据绑定：
+```
+```
+    <div id="app">
+        <span>
+            {{ msg }}
+        </span>
+        <br>
+        <span v-html='mkr'>
+            dfrgfffff       ----内容被替换            
+        </span>
+
+        <hr>
+
+
+        <span v-once>
+            {{apple}}
+            
+            <br>
+
+            <span>
+                {{ beautiful }}
+            </span>
+        </span>
+    </div>
+
+    let vm = new Vue({            
+            
+            el:'#app',
+            data:{      // 插值 Mustache
+                // 文本和原始html
+
+                msg:'<h2>弗拉理得</h2>',
+                mkr:'<h1>唧唧复唧唧</h1>',
+                
+                apple:'苹果',
+                beautiful:'比悠提否!!'
+                
+            }
+        });
+```
+
+2. Attribute 和JavaScript表达式
+```
+    <div id="app">
+        <div v-bind:id="dynamicId">            
+            <button v-bind:disabled="isButtonDisabled">
+                点这试试
+            </button>
+            <br>
+            {{number + 1}}
+            <br>
+            {{ok>66 ? 'YES' : 'NO'}}
+            <br>
+            {{sentence.split('').reverse().join('')}}
+            <br>
+            {{Math.pow(figure,2)}}
+        </div>
+        
+    </div>
+
+    data:{          
+        // Attribute
+
+        dynamicId:1,
+        isButtonDisabled:true,
+
+        // 使用JavaScript表达式
+                
+        number:22,      // 23
+        ok:12,          // NO
+        sentence:'喝开水',      // 水开喝
+        figure:9,              // 81
+    }
+```
+
+3. vue 中的 attribute 和 property区别
+```
+    attribute 是标签的属性;
+
+    property 是对象的属性。
+```
+
+4. JavaScript 脚本放置位置
+```
+JavaScript脚本通常放置在三个位置：
+
+    1、head部分JavaScript脚本;
+    2、body部分JavaScript脚本;
+    3、单独以.js结尾的文件中的JavaScript脚本。
+    
+```
+*客户端会按顺序读取并解析文档内容，**body部分的JavaScript脚本会优先执行**，其他部分的JavaScript脚本会通过调用执行。*
+
+5. JavaScript 中表达式和语句的区别
+```
+    a. JavaScript中的表达式和语句是有区别的。一个表达式会产生一个值,它可以放在任何需要一个值的地方;
+
+    b. 语句包含表达式,语句可以理解成一个行为。循环语句和if语句就是典型的语句。一个程序是由一系列语句组成的;
+
+    c. JavaScript中某些需要语句的地方,你可以使用一个表达式来代替。这样的语句称之为表达式语句。但反过来不可以:你不能在一个需要表达式的地方放一个语句。比如,一个if语句不能作为一个函数的参数。
+
+举例：
+
+    var x;
+    if (y >= 0) {       //这是个if语句
+    x = y;
+    } else {
+    x = -y;
+    }
+
+    var x = (y >= 0 ? y : -y);      //类似if语句功能的表达式叫做条件运算符;等价于上述语句。
+```
\ No newline at end of file
-- 
Gitee