node.js学习笔记(1)

安装node.js

直接官网下载,默认安装就行。

安装express

在当前工程文件目录下
express -e
npm install

安装mysql

npm install mysql --save-dev

express 安装后

app.js 配置文件

var index = require('./routes/index');
var users = require('./routes/users');
var app = express();

app.use('/news', index); //监听发往news的请求的时候,用index路由
app.use('/users', users);

routes ==> index.js

var express = require('express');
var router = express.Router();
var mysql = require('mysql')

router.get('/', function(req, res, next) {
    var newstype=req.query.newstype; //查询条件

  //mysql数据库连接
    var connection = mysql.createConnection({
        host: 'localhost',
        port: 3306,
        user: 'root',
        password: 'root',
        database: 'xynews'
    });
    connection.connect();
    //sql语句
    connection.query('SELECT * FROM `baidunews2` where `newstype` = ?',[newstype],function(err, rows, fields) {
        console.log(rows);
        //返回json对象结果
        res.json(rows);
    })
});

module.exports = router;

js ==》news.js

$(document).ready(function() {
    refreshNews("1");
    $(".typeon span").on("click",function(){
       var index=$(this).index();
       refreshNews(index+1)
    });
});

function refreshNews(type) {
    var $lists = $(".article ul");
    $lists.empty();
    $.ajax({
        url: '/news',
        type: 'get',
        datatype: 'json',
        data: { newstype: type },
        success:function(data) {
            console.log(data);
            for (var i = 0; i <= data.length - 1; i++) {
                var $list = $('<li>' + data[i].news_text + '</li>').appendTo($lists);
            }
        }
    })
}


html==》index.html

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title></title>
    <style type="text/css" media="screen">
    .typeon{
        width: 600px;
    }
    span {
        display: inline-block;
        width: 200px;
        height: 100px;
        text-align: center;
        line-height: 100px;
    }
    </style>
</head>

<body>
 <div class="typeon">
        <span>分类1</span><span>分类2</span><span>分类3</span>
    </div>
    <div class="article">
        <ul></ul>
    </div>

    <script src="js/jquery-2.1.1.min.js"></script>
    <script src="js/news.js"></script>
</body>

</html>

简单的实现了,数据的查询与显示!!

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 1. 第一步, 在电脑上安装node 可以在官网上下安装包或者用命令去安装, 百度一下 你就知道. 2. 创建第一...
    Dev_hell03W阅读 146评论 2 1
  • 1,档案读取,输出档案资料, 2.获取请求参数 3.npm 维护管理套件。 4. 常用npm 5.package....
    一洼世界阅读 271评论 0 0
  • 本系列学习文档是学习其它文章的时候,摘录和总结的内容,版权归原作者所有 参考文献:《Node.js开发指南》菜鸟教...
    Realank阅读 556评论 2 1
  • 搭建开发环境并模拟交互数据 一、实验说明 下述介绍为实验楼默认环境,如果您使用的是定制环境,请修改成您自己的环境介...
    玄月府的小妖在debug阅读 2,152评论 0 15
  • 开学前一夜,太紧张了,孩子上学,我要上班,问题接踵而来,虽然早有准备总感觉还是有些措手不及。紧张,睡不着,还有点小期待。
    i白杨树阅读 209评论 0 0