分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 软件开发

Vue.js最简单的代码

发布时间:2023-09-06 02:25责任编辑:熊小新关键词:js
<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <title>vue.js的入门</title>
 <!-- 导入 -->
 <script type="text/javascript" src="../jss/vue.js"></script>
 <script type="text/javascript">
  <!-- 单一入口 -->
  window.onload = function(){
   var app = new Vue({
    // el属性用来绑定元素节点
    el:"#app",
    // data属性用来绑定数据
    data:{
     message:"Hello World"
    }
   });
   // 建立vue对象
   var app2 = new Vue({
    el:"#app2",
    data:{
     message:"页面加载中"+new Date().toLocaleString+"今天心情真好!"
    }
   });
  }
 </script>  
</head>
<body>
<div id="app">
 <!-- vue的模板语法,用来输出变量 -->
 {{message}}
</div> 
<div id="app2">
 <!-- 把title属性和messa变量联系起来 -->
 <span v-bind:title="message">
  请让鼠标悬停几秒钟,来观看这个页面刷新的时间
 </span>
</div>
<!-- 将tilte写“死” -->
 <a href="#" title="这是一个空链接">点击我</a>
</body>
</html>

Vue.js最简单的代码

原文地址:https://www.cnblogs.com/gaxy/p/10075768.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved