jhfsdhsgfsdggreqZa-CSDN博客

原创 javascript入门2 直接写入 HTML 输出流/对事件的反应/改变 HTML 图像/改变 HTML 样式/验证输入

直接写入 HTML 输出流<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">

2021-01-20 16:08:46 140

原创 javascript 入门01 显示时间案例

<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"> <meta http-

2021-01-20 15:44:38 124

原创 sequelize 连接数据库，创建模型

Sequelize 是 Node 的一个 ORM(Object-Relational Mapping) 框架，用来方便数据库操作。首先我们要引入npm包，sequelize 依赖 mysql2 作为底层驱动，暴露出自己的 API 让我们调用，在转成 mysql 语句进行执行。“mysql2”: “^1.5.1”,“sequelize”: “^4.28.6”const Sequelize = require('sequelize')// 连接数据库const sequelize = new Seq

2021-01-08 17:53:27 496

原创创建express项目的流程

1.安装express-generatornpm install express-generator -g2.创建express项目express -e 项目名称 -e ejs模板3.分析目录1. package.json 整个项目的依赖配置文件2. app.js 是整个项目的入口文件3. views/xx.ejs 是整个项目的模板（模板内容是什么，将来页面呈现就是什么）4. routes 是整个项目的路由配置文件5. public 静态资源文件（img css js )6. nod

2021-01-08 16:00:58 229

原创 sequelize curd操作查找模糊匹配

create async createUtopiaService(info) { let { user_id,title,content,detail,type,language } = info await this.deleteUtopiaService(language) return await UtopiaModel.create({ title, content, de

2021-01-08 09:50:57 447

原创实习项目总结

squelize curd 操作查找： async getContactUsInfo (info) { let { language } = info return await ContactUsModel.findOne({ where: { language, status: 1, deleted_at: null },

2021-01-06 15:48:59 68

原创 api 项目逻辑

behavior 行为层一般业务逻辑复杂的放在行为层做，就是一般同时调到两个方法及以上，就要在业务层封装方法services 一般模型的curd操作放在服务层做routers 一般路由的定义放在路由在model 一般定义表...

2021-01-05 17:12:05 120 1

原创项目配置以及基本操作

数据迁移node migration/v1.0#Usage 使用说明※1.进入config目录，新建config.local.js,将config.local.example.js内容复制到config.local.js后修改配置项cd configcp config.local.example.js config.local.js...※2.安装模块npm install※3.进入~certificate目录，新建apiclient_cert.p12文件;touch ap

2021-01-05 12:02:35 140

原创 git 操作

第一步 git pull第二步 git merge origin/自己的分支（简写git merge）第三步 git add .第四步 git commit -m “注释”第五步 git push origin/自己的分支 (简写git push)

2021-01-05 11:54:13 61

原创 express入门05　用户注册前端页面

**app.js **// 引入模块var express = require('express')var mongoose = require('mongoose')var swig = require('swig')var app = express()// 设置静态文件app.use('/public',express.static(__dirname+'/public'))//设置模板引擎app.engine('html',swig.renderFile)app.set('vi

2021-01-04 11:59:15 135 4

原创 express入门04 数据库连接表结构创建模型创建

app.js 连接数据库var express = require('express')var mongoose = require('mongoose')var app = express()mongoose.connect('mongodb://localhost:27017/blog',function(err){ if(err){ console.log('数据库连接失败') }else{ console.log('数据库连接成功') app.listen(8081) }

2021-01-04 00:35:13 251

原创 express入门03 模块划分 admin api main 三个模块

app.js 项目运行入口文件// 模块引入var express = require('express')var swig = require('swig')// 静态文件托管设置app.use('/public',express.static(__dirname+'/public'))// 视图设置app.engine('html',swig.renderFile)app.set('views','./views')app.set('view engine','html')swig

2020-12-31 15:45:36 162

原创 express 入门02

设置视图引擎，加载视图文件,设置静态文件托管// 引入模块var express = require('express')var swig = require('swig')var app = express()// 静态文件托管设置app.use('/public',express.static(__dirname+'/public'))//设置模板引擎app.engine('html',swig,renderFile)app.set('views','./views')app.se

2020-12-31 15:04:43 76

原创 express 入门

创建一个基本服务器var express = require('express')var app = express()app.get('/',function (req,res,next) { res.render('hello express')}app.listen(8080)

2020-12-31 14:58:27 83

原创 Vue.js 组件

组件（Component）是 Vue.js 最强大的功能之一。组件可以扩展 HTML 元素，封装可重用的代码。组件系统让我们可以用独立可复用的小组件来构建大型应用，几乎任意类型的应用的界面都可以抽象为一个组件树注册一个全局组件语法格式如下：Vue.component(tagName, options)tagName 为组件名，options 为配置选项。注册后，我们可以使用以下方式来调用组件：<tagName></tagName>全局组件所有实例都.

2020-07-19 13:22:11 88

原创 Vue.js 表单

这节我们为大家介绍 Vue.js 表单上的应用。你可以用 v-model 指令在表单控件元素上创建双向数据绑定。v-model 会根据控件类型自动选取正确的方法来更新元素。输入框实例中演示了 input 和 textarea 元素中使用 v-model 实现双向数据绑定：<!DOCTYPE html><html><head><meta charset="utf-8"><title>Vue 测试实例 - 菜鸟教程(runo.

2020-07-19 12:49:35 94

原创 Vue.js 事件处理器

事件监听可以使用 v-on 指令： v-on<!DOCTYPE html><html><head><meta charset="utf-8"><title>Vue 测试实例 - 菜鸟教程(runoob.com)</title><script src="https://cdn.staticfile.org/vue/2.2.2/vue.min.js"></script></head>&.

2020-07-19 12:27:53 105

原创 Vue.js 样式绑定

Vue.js class class 与 style 是 HTML 元素的属性，用于设置元素的样式，我们可以用 v-bind 来设置样式属性。 Vue.js v-bind 在处理 class 和 style 时，专门增强了它。表达式的结果类型除了字符串之外，还可以是对象或数组class 属性绑定我们可以为 v-bind:class设置一个对象，从而动态的切换 class: 实例 1 实例中将 isActive 设置为 true 显示了一个绿色的 div 块，如果设置为false 则不显示：&l.

2020-07-19 11:40:21 86

原创 Vue.js 监听属性

本章节，我们将为大家介绍 Vue.js 监听属性 watch，我们可以通过 watch 来响应数据的变化。以下实例通过使用 watch 实现计数器：实例<!DOCTYPE html><html><head><meta charset="utf-8"><title>Vue 测试实例 - 菜鸟教程(runoob.com)</title><script src="https://cdn.staticfile.org/.

2020-07-19 11:18:10 89

原创 Vue.js 计算属性

计算属性关键词: computed。计算属性在处理一些复杂逻辑时是很有用的。可以看下以下反转字符串的例子：实例 1<!DOCTYPE html><html><head><meta charset="utf-8"><title>Vue 测试实例 - 菜鸟教程(runoob.com)</title><script src="https://cdn.staticfile.org/vue/2.2.2/vue.min..

2020-07-19 11:03:21 90

原创 Vue循环语句

循环语句循环使用 v-for 指令。 v-for 指令需要以 site in sites 形式的特殊语法， sites 是源数据数组并且 site 是数组元素迭代的别名。 v-for 可以绑定数据到数组来渲染一个列表：v-for 指令<!DOCTYPE html><html><head><meta charset="utf-8"><title>Vue 测试实例 - 菜鸟教程(runoob.com)</title>.

2020-07-19 10:43:22 97

原创 Vue.js 条件与循环

条件判断 v-if 条件判断使用 v-if 指令,v-if 指令在元素和 template 中使用 v-if 指令：<!DOCTYPE html><html><head><meta charset="utf-8"><title>Vue 测试实例 - 菜鸟教程(runoob.com)</title><script src="https://cdn.staticfile.org/vue/2.2.2/vue.min..

2020-07-19 10:25:15 56

原创 Vue.js 模板语法

Vue.js 使用了基于 HTML 的模版语法，允许开发者声明式地将 DOM 绑定至底层 Vue 实例的数据。 Vue.js 的核心是一个允许你采用简洁的模板语法来声明式的将数据渲染进 DOM 的系统。结合响应系统，在应用状态改变时， Vue能够智能地计算出重新渲染组件的最小代价并应用到 DOM 操作上。插值文本数据绑定最常见的形式就是使用 {{…}}（双大括号）的文本插值：<!DOCTYPE html><html><head><meta .

2020-07-18 22:53:39 93

原创 Vue教程，第一个实例

<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1"> <title></title> <script src="vue/vue.min.js"></script> </head>

2020-07-18 10:35:25 76

原创 Bootstrap 4 多媒体对象

Bootstrap 提供了很好的方式来处理多媒体对象（图片或视频）和内容的布局。应用场景有博客评论、微博等:基础多媒体对象要创建一个多媒体对象，可以在容器元素上添加 .media 类，然后将多媒体内容放到子容器上，子容器需要添加 .media-body 类，然后添加外边距，内边距等效果:<!DOCTYPE html><html><head> <title>Bootstrap 实例</title> <meta char.

2020-07-12 17:56:21 201

原创 Bootstrap 4 Flex（弹性）布局

Bootstrap 4 通过 flex 类来控制页面的布局。弹性盒子(flexbox) Bootstrap 3 与 Bootstrap 4 最大的区别就是 Bootstrap 4 使用弹性盒子来布局，而不是使用浮动来布局。弹性盒子是 CSS3 的一种新的布局模式，更适合响应式的设计，以下实例使用 d-flex 类创建一个弹性盒子容器，并设置三个弹性子元素：<!DOCTYPE html><html><head> <title>Boot.

2020-07-12 17:50:23 276

原创 Bootstrap4 小工具

Bootstrap4 提供了一些小工具，可以让我们不用写 CSS 代码就能实现想要的效果。边框使用 border 类可以添加或移除边框:<!DOCTYPE html><html><head> <title>Bootstrap 实例</title> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, init.

2020-07-12 15:33:19 87

原创 Bootstrap 滚动监听(Scrollspy)

滚动监听（Scrollspy）插件，即自动更新导航插件，会根据滚动条的位置自动更新对应的导航目标。其基本的实现是随着您的滚动。如何创建滚动监听以下实例演示了如何创建滚动监听：<!DOCTYPE html><html><head> <title>Bootstrap 实例</title> <meta charset="utf-8"> <meta name="viewport" content="width.

2020-07-12 15:21:07 183

原创 Bootstrap4 弹出框

弹出框控件类似于提示框，它在鼠标点击到元素后显示，与提示框不同的是它可以显示更多的内容。如何创建弹出框通过向元素添加 data-toggle=“popover” 来来创建弹出框。 title 属性的内容为弹出框的标题，data-content 属性显示了弹出框的文本内容：<a href="#" data-toggle="popover" title="弹出框标题" data-content="弹出框内容">多次点我</a>注意: 弹出框要写在 jQuery 的初始.

2020-07-12 13:21:26 629

原创 Bootstrap4 提示框

提示框是一个小小的弹窗，在鼠标移动到元素上显示，鼠标移到元素外就消失。如何创建提示框通过向元素添加 data-toggle=“tooltip” 来来创建提示框。 title 属性的内容为提示框显示的内容：<a href="#" data-toggle="tooltip" title="我是提示内容!">鼠标移动到我这</a>注意: 提示框要写在 jQuery 的初始化代码里: 然后在指定的元素上调用 tooltip() 方法。以下实例可以在文档的任何地方使用提示.

2020-07-12 13:07:34 201

原创 Bootstrap4 模态框

模态框（Modal）是覆盖在父窗体上的子窗体。通常，目的是显示来自一个单独的源的内容，可以在不离开父窗体的情况下有一些互动。子窗体可提供信息交互等。如何创建模态框以下实例创建了一个简单的模态框效果：<!DOCTYPE html><html><head> <title>Bootstrap 实例</title> <meta charset="utf-8"> <meta name="viewport" c.

2020-07-12 12:47:30 352

原创 Bootstrap4 轮播

如何创建轮播以下实例创建了一个简单的图片轮播效果：<!DOCTYPE html><html><head> <title>Bootstrap 实例</title> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" .

2020-07-12 10:40:43 469

原创 Bootstrap4 自定义表单

Bootstrap4 可以自定义一些表单的样式来替换浏览器默认的样式。自定义复选框如果要自定义一个复选框，可以设置为父元素，类为 .custom-control 和.custom-checkbox，复选框作为子元素放在该里头，然后复选框设置为 type=“checkbox”，类为.custom-control-input。复选框的文本使用 label 标签，标签使用 .custom-control-label 类，label 的 for 属性值需要匹配复选框的id。<!DOC

2020-07-12 10:21:00 372

原创 Bootstrap4 输入框组

我们可以使用 .input-group 类来向表单输入框中添加更多的样式，如图标、文本或者按钮。使用 .input-group-prepend 类可以在输入框的的前面添加文本信息， .input-group-append类添加在输入框的后面。最后，我们还需要使用 .input-group-text 类来设置文本的样式<!DOCTYPE html><html><head> <title>Bootstrap 实例</title> .

2020-07-11 22:36:14 485

原创 Bootstrap4 表单控件

Bootstrap4 支持以下表单控件：input textarea checkbox radio selectBootstrap Input Bootstrap 支持所有的 HTML5 输入类型: text, password, datetime,datetime-local, date, month, time, week, number, email, url, search,tel, 以及 color。注意：: 如果 input 的 type 属性未正确声明，输入框的样式将不会显示。.

2020-07-11 22:12:00 97

原创 Bootstrap4 表单

在本章中，我们将学习如何使用 Bootstrap 创建表单。Bootstrap 通过一些简单的 HTML标签和扩展的类即可创建出不同样式的表单。表单元素 input, textarea和 select elements 在使用 .form-control类的情况下，宽度都是设置为 100%。Bootstrap4 表单布局堆叠表单 (全屏宽度)：垂直方向内联表单：水平方向Bootstrap 提供了两种类型的表单布局:堆叠表单以下实例使用两个输入框，一个复选框，一个提交按钮来创建堆叠表单.

2020-07-11 21:56:36 176

原创 Bootstrap4 面包屑导航（Breadcrumb）

面包屑导航是一种基于网站层次信息的显示方式。以博客为例，面包屑导航可以显示发布日期、类别或标签。它们表示当前页面在导航层次结构内的位置，是在用户界面中的一种导航辅助。Bootstrap 中的面包屑导航是一个简单的带有 .breadcrumb class 的无序列表。分隔符会通过CSS（bootstrap.min.css）中的 ::before 和 content 来添加，下面所示的 class 自动被添加：.breadcrumb-item + .breadcrumb-item::before {.

2020-07-11 12:52:38 267

bootstrap项目实战.rar

空空如也