前端学习(2056):初识vue.js

MVVM模式

jquery.js

<!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>demo704</title>
</head><body><div id="app"><button>Click me</button></div><script src="./js/jquery.min.js">var btn = document.getElementsByTagName('button');console.log(btn);var showBtn = true;if (showBtn) {var btn = $('<button>Click me</button>');btn.on('click', function() {console.log('clicked');});$('#app').append(btn);}</script>
</body></html>

vue.js

<!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>demo704</title>
</head><body><div id="app"><button v-if="showBtn" v-on:click="handleClick">click me</button><p>{{name}}</p></div><script src="./js/vue.js">var app = new Vue({el: '#app',data: {showBtn: true,name: 'geyao'},methods: {handleClick: function() {console.log('clicked')}}})</script>
</body></html>

 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/418189.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

什么是响应式网页

什么是响应式网页 2000: 塞班、黑莓&#xff0c;GPRS&#xff0c;2.5G&#xff0c;可以浏览WML网页 2008: iOS/Linux&#xff0c;3G&#xff0c;Safari&#xff0c;可以浏览HTML网页 Android/Linux&#xff0c;Chrome&#xff0c;可以浏览HTML网页 Responsive Web Page 响应式/…

HttpWebRequest类

HttpWebRequest类与HttpRequest类的区别。 HttpRequest类的对象用于服务器端&#xff0c;获取客户端传来的请求的信息&#xff0c;包括HTTP报文传送过来的所有信息。而HttpWebRequest用于客户端&#xff0c;拼接请求的HTTP报文并发送等。 HttpWebRequest这个类非常强大&#xf…

比较创建几种线程的方式

JDK5.0新增的创建多线程的方式&#xff1a; 新增一&#xff1a; //创建多线程的方式三&#xff1a;callabe;import java.util.concurrent.Callable; import java.util.concurrent.ExecutionException; import java.util.concurrent.FutureTask;//1.创建一个Callable的实现类 c…

线程的安全问题

解决方法一: 注意:在synchronized中的同步监视器&#xff08;锁&#xff09;只能是唯一的。 方式二&#xff0c;同步方法 方法三&#xff1a; lock() lock锁 public class ThreadTest6 {public static void main(String[] args) {Window w new Window();Thread t1 new Thre…

数据的个人视角:数据可视化的意义

当谈论到数据可视化对个人用户的实用价值时&#xff0c;很多人可能会想到它仅适用于企业或专业领域。然而&#xff0c;数据可视化对个人用户同样具有重要的实用价值。本文将从可视化从业者的角度出发&#xff0c;简单说说数据可视化对个人用户的实用价值。 首先&#xff0c;数…

线程的通信

//线程通信 //线程1 线程2 交替打印1——100 //wait()和notify()方法需要在一个监视器的同步代码块 中或者是同一个同步方法中// wait()&#xff1a;线程从运行状态进入阻塞状态&#xff0c;并且释放锁 // notify():一旦执行此方法就会唤醒被wait的一个线程&#xff0c;如果多个…

线程通信的经典问题:生产者消费者问题

package ThreadTest2; // 线程通信的经典问题&#xff1a;生产者消费者//店员&#xff08;资源&#xff09; class Clerk{private int productCount 0 ;public synchronized void produceProduct() {if(productCount < 100 ) {productCount;System.out.println(Thread.curr…

String类中不同拼接方式

有变量名参与都不是在常量池中了&#xff0c;类似于new

使用JMeter创建数据库(Mysql)测试

我的环境&#xff1a;MySQL&#xff1a;mysql-essential-5.1.51-win32 jdbc驱动&#xff1a;我已经上传到csdn上一个&#xff1a;http://download.csdn.net/source/3451945 JMeter&#xff1a;jmeter-2.4 任意版本都行。 1.首先我们要有一个可以做测试的数据库&#xff0c;当然…

String类与其他数据类型得转换

一&#xff1a;与基本数据类型或者包装类 二、String与char型数组得转换 三、String类与字节数组byte[]之间的转换 输出的是字符中得ASCII码。 getBytes使用的默认得编码集 可以自主设置编码集否则为默认编码集 输出&#xff1a;

字符串类中的StringBuffer,StringBuilder

StringBuffer类的常用方法 &#xff0c; String StringBuffer,StringBuilder的效率

JAVA日期和时间API

JDK8以前&#xff1a; public void test2() { // 构造器1&#xff1a;Date date1 new Date();System.out.println(date1); // date1.toString// 构造器2&#xff1a;创建指定毫秒数的Date对象Date date2 new Date(1631722133700L);System.out.println(date2);} JDK8以后: …