@二十六
@二十六

漂亮的搜索页面

Home页面

  在页面当中，可以直接输入要搜索的东西，点击搜索图片或者按下Enter键就可以进行搜索，原理就是利用JS改变浏览器地址栏中的URL，效果图如下，如果输入的内容为空，则会进行提示；


代码：


<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>HOMEtitle>
    <link rel="stylesheet" href="./index.css">
    <link rel="shortcut icon" href="./img/logo.ico" type="image/x-icon">
head>
<body>
    <div id="app">
        
        <transition>
            <p v-if="isInfo" class="info" v-cloak>{{ infoText }}p>
        transition>
    
        
        <section class="searchBox">
            <div class="clock">
                <p id="year">p>/
                <p id="month">p>/
                <p id="day">p>--
                <p id="hour">p>
                <p id="minute">p>
                <p id="second">p>
            div>
            <div class="inputBox">
                <input type="text" placeholder="Search" id="searchInput" v-model="queryString" v-on:keyup.enter="search">
                <img src="./img/search.png" alt="" @click="search">
            div>
        section>
    div>
body>
<script>
    window.onload = function(){
        // 时钟代码
        let year_text = document.getElementById("year");
        let month_text = document.getElementById("month");
        let day_text = document.getElementById("day");
        let hour_text = document.getElementById("hour");
        let minute_text = document.getElementById("minute");
        let second_text = document.getElementById("second");
        let timer = setInterval(function(){
            let date = new Date();
            let year = date.getFullYear();
            let month = date.getMonth();
            let day = date.getDate();
            let hour = date.getHours();
            let minute = date.getMinutes();
            let second = date.getSeconds();
            year_text.innerHTML = year;
            month_text.innerHTML = (month + 1);
            day_text.innerHTML = day;
            hour_text.innerHTML = hour + ":";
            minute_text.innerHTML = minute + ":";
            second_text.innerHTML = second;
        }, 100);

        // 设置input框自动获取焦点
        let searchInput = document.getElementById("searchInput");
        searchInput.focus();
    };
script>
<script src="https://cdn.bootcss.com/vue/2.6.11/vue.min.js">script>
<script>
    const vm = new Vue({
        el:"#app",
        data:{
            queryString:"", // 查询字符串
            isInfo:false, // 是否显示提示信息
            infoText:"", // 要显示的提示信息
        },
        mounted() {
            
        },
        methods: {
            // 按下enter键或点击搜索图标进行搜索
            search:function(){
                if(this.queryString === ""){  
                    this.infoText = "输入的内容不能为空！";                  
                    this.isInfo = true;
                    let that = this;
                    // 1200毫秒之后关闭提示信息
                    setTimeout(function(){
                        that.isInfo = false;
                    }, 1200);
                }else{
                    this.queryString = "";
                    // 在当前窗口打开
                    // window.location.href = "https://www.baidu.com/s?ie=UTF-8&wd=" + this.queryString;

                    // 在新窗口打开
                    window.open("https://www.baidu.com/s?ie=UTF-8&wd=" + this.queryString);
                }
            }
        },
    });
script>
html>

*{
    margin: 0;
    padding: 0;
}
html{
    width: 100vw;
    height: 100vh;
    background-image: url("./img/bgc.jpg");
    background-size: cover;
}

/* 提示信息 */
.info{
    width: 220px;
    height: 40px;
    background-color: rgba(255, 255, 255, 0.5);
    position: fixed;
    left: 50%;
    top: 20px;
    transform: translateX(-50%);
    border-radius: 5px;
    text-align: center;
    line-height: 40px;
    color: rgba(255, 255, 255, 0.8);
    user-select: none;
}
.v-enter,
.v-leave-to{
    opacity: 0;
    top: -20px;
}
.v-enter-active,
.v-leave-active{
    transition: all 0.4s ease-in-out;
}
[cloak]{
    display: none;
}


/* 中间搜索框 */
.searchBox{
    width: 60%;
    min-width: 400px;
    height: 30vh;
    margin: 10vh auto 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.clock{
    width: 100%;
    height: 60px;
    margin-bottom: 20px;
    color: rgba(255, 255, 255, 0.6);
    font-size: 36px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-family: "Monoton";
}
.clock > p{
    user-select: none;
}

.inputBox{
    width: 60%;
    height: 44px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: rgba(255, 255, 255, 0.5);
    padding: 0 15px;
    border-radius: 20px;
}
.inputBox > input{
    background: none;
    border: none;
    outline: none;
    padding: 0 10px 0 0;
    flex: 1;
    height: 44px;
    color: #242323;
    font-size: 16px;
}
.inputBox > input::placeholder{
    color: #242323;
    font-size: 16px;
}
.inputBox > img{
    width: 1.3rem;
    height: 1.3rem;
}
.inputBox > img:hover{
    cursor: pointer;
}

用到的图片和图标：图片是在必应图片上找的，图标是在阿里巴巴矢量图标库中找的。
漂亮的搜索页面_第1张图片
漂亮的搜索页面_第2张图片

你可能感兴趣的:(前端HTML和CSS,html5,css3)

  • java计算机毕业设计智能停车场管理系统源码+mysql数据库+系统+部署+lw文档 法姆利 javamysql开发语言
    java计算机毕业设计智能停车场管理系统源码+mysql数据库+系统+部署+lw文档java计算机毕业设计智能停车场管理系统源码+mysql数据库+系统+部署+lw文档本源码技术栈：项目架构：B/S架构开发语言：Java语言开发软件：ideaeclipse前端技术：Layui、HTML、CSS、JS、JQuery等技术后端技术：JAVA运行环境：Win10、JDK1.8数据库：MySQL5.7/8
  • 【组件】layui-v2.9.14 smart_dream layui前端javascript
    官网：Layui-极简模块化前端UI组件库(官方文档)github：GitHub-layui/layui:一套遵循原生态开发模式的WebUI组件库，采用自身轻量级模块化规范，易上手，可以更简单快速地构建网页界面。gitee：Layui:一套开源免费且受众广泛的WebUI组件库下载：可以在官网首页或更新日志页面下载到Layuilayer：通用弹出层组件layer-Layui文档laydate：Lay
  • JSP/JAVAWEB/SSM/J2EE高考志愿填报推荐系统的开发 计算机程序设计开发 javamysqljavawebssm推荐系统
    目录1、概述2、功能描述3、数据表4、目录结构5、实现过程5.1SRC目录5.2webroot前端文件6、最终效果6.1前台用户效果6.2后台管理员用户效果1、概述开发环境：jdk1.8、tomcat7.0、mysql5.2开发工具：idea2019.3.1、navicat15编程语言后端：java；框架和引用的包：JavaBeanServletMVC、log4j.jar编程语言前端：JSP、ht
  • 采用Angular + NG-ZORRO + Ng Alain 框架搭建的 MES前端框架 潜龙在渊 AngularNG-ZORROhtmlcsshtml5
    闲来无事，想了解下Angular开发技术栈，以备不时之需，断断续续花费1-2周时间，基本掌握antdesign旗下的Angular前端框架。采用开发工具：VisualStudioCode技术栈：Angular，Typescript，NG-ZORRO,AntDesign,NgAlain等另外，这个不完整的demo，也有助于理解钉钉平台下内部系统对接流程
  • 简单工作流（后端部分-spring boot，顺便优化了下ui） liaoyuecai ui
    整个项目我丢到github上去了，需要copy的可以直接去githubhttps://github.com/liaoyuecai/demo前端部分目录在：/react/antd-pro-demo/src/pages/workflow后端部分目录在：/java/spring-boot-demo/src/main/java/com/demo/workflow我这边用的JPA做持久化，如果是mybati
  • 用JavaScript实现的5个常见函数 强哥科技兴
    在学习JavaScript，或者前端面试中，有人会问你节流函数、防抖函数、递归函数等，本文分享了5个常见函数，希望对你有所帮助。在JavaScript中有一些问题会被拿出来经常讨论，这些问题每个人都有不同的思路，想要理解这些问题，最好的方法就是自己实现一遍，话不多说，开始正题。数组扁平化数组扁平化有很多方法，但最终最好的方法就是递归，实现一个指定深度的扁平化方法，这样基本的套路都会了解。1func
  • node.js版本管理器——NVM 小清20 npmnode.js前端
    在日常工作中，需同时开发好几个前端项目的时候，可能不同项目使用的node的版本也不一样，而一台电脑只能安装和同时使用一个版本的node，这个时候我们需要借助NVM来管理node的版本了。下面一起来看下是怎么使用NVM的吧。一、什么是NVMnvm的全称是node.jsversionmanagement，是专门用来管理node版本的工具，可用对node的版本进行查看、下载、切换使用等操作二、如何安装N
  • ArtPlayer.js 开源项目使用手册 苏承根
    ArtPlayer.js开源项目使用手册ArtPlayer:art:ArtPlayer.jsisamodernandfullfeaturedHTML5videoplayer项目地址:https://gitcode.com/gh_mirrors/ar/ArtPlayer1.目录结构及介绍ArtPlayer.js的项目目录精心组织，以支持高效的开发与维护。以下是核心的目录结构及简要介绍：├──docs
  • java-net-php-python-ssmKTV点歌系统查重PPT计算机毕业设计程序 荣荣科技 javaphp开发语言
    java-net-php-python-ssmKTV点歌系统查重PPT计算机毕业设计程序java-net-php-python-ssmKTV点歌系统查重PPT计算机毕业设计程序本源码技术栈：项目架构：B/S架构开发语言：Java语言开发软件：ideaeclipse前端技术：Layui、HTML、CSS、JS、JQuery等技术后端技术：JAVA运行环境：Win10、JDK1.8数据库：MySQL5
  • docker3 疯癫的小珍呐 linux
    数据持久化线上考试系统部署1.部署前端服务器1.#将资源上传到服务器scp-rdist/[email protected]:~2.#创建基础容器，在服务器上systemctlstartdocker.servicedockerpullcentosdockerrun-it--namec0centos:latest/bin/bash3.#在容器中修改yum源rm-rf/etc/yum.repos.d/*
  • 新书速览|HTML5+CSS3 Web前端开发与实例教程：微课视频版 全栈开发圈 前端html5css3
    《HTML5+CSS3Web前端开发与实例教程：微课视频版》本书内容《HTML5+CSS3Web前端开发与实例教程：微课视频版》秉承“思政引领，立德树人”的教育理念，自然融入多维度、深层次的思政元素，全面对标企业和行业需求；引入现代Web前端开发的核心技术，如Flex布局、Grid布局，以及人工智能编程插件，同时融入企业开发实践，确保学习内容与实际工作紧密相关。全书以一个完整案例为主线，结合综合项
  • CDN原理 SkTj
    BIND视图技术实现DNS，Squid做前端缓存简单的CDN的搭建：1、CDN的工作原理：当外网访问内网域名的时候，外网先经过本地的dns查询，然后dns向内网搭建的dns发出申请，内网dns读取配置文件named.conf中包含IP列表的include，如果IP列表中有该地的IP记录则对应IP列表寻找对应的视图，如没有记录则拒绝返回信息。视图将解析你访问的域名到squid缓存服务器，squid再
  • CSS3中display显示属性 阿立聊代码 网页设计css3前端html
    显示属性把块级元素改为行内元素：p{display:inline}把行内元素改为块级元素，会填满父元素：a{display:block}设为none，全都消失，位置也不占，visibility为hidden消失了，但是还占位置。
  • Cesium使用视频创建自定义纹理 garefield jsshader
    本文参考了cesium的自定义texture实现，在此基础上做了修改，引入html5的视频进行渲染，实测比使用视频作为材质效率略有优化，且更具灵活性，利于对视频进行二次处理，废话不多说，代码如下：varPrimitiveTexture=(function(){varvertexShader;varfragmentShader;varmaterialShader;varvideo;function_
  • 浏览器精度问题 Jinuss 前端前端javascript
    问题产生浏览器端一般情况下无法正确解析后端返回的long类型的主键，比如作为索引的id，为了避免重复可能设置成一个很大的唯一UUID，但是超过一定范围后，浏览器可能无法正常解析。这主要和Javascript的精度问题有关，long类型的数据会被截断，超过17位就会补0，导致前端无法正确解析。解决方案使用BigInt类型，BigInt类型是Javascript新增的数据类型，它可以表示任意大小的整数
  • 计算机专业的真正的就业情况 程序员牛马家 有关计算机就业的自我观点数据结构
    首先听到计算机行业，大多数人岗位已经饱和，前端已死，程序员35岁危机。但是事实上这些认知都是片面的，今天由我来为大家分析计算机行业的内幕。疫情过后，过内各种行业都受到了冲击，你们敢说除了体制内的行业，那个行业没有饱和，那个行业不会有35岁危机吗。有那个行业不是大量裁人。很多人说双非二本甚至是重点一本毕业后都没办法就业，但是扪心自问一下，全班50多个人，有几个好好学过计算机，花时间去研究计算机，学懂
  • JS中DOM详解【十大点】 OEC小胖胖 JavaScriptjavascript前端开发语言htmlecmascript
    JavaScriptDOM详解JavaScript中的DOM（文档对象模型）是前端开发的重要知识点。它通过对象结构来表示HTML或XML文档，并提供对其内容进行操作的接口。本文将详细介绍DOM的基础知识、常用操作和事件处理等内容，确保全面且深入。1.DOM概述文档对象模型（DOM,DocumentObjectModel）是浏览器对HTML和XML文档的编程接口。DOM将整个文档作为树结构，其中的每
  • 【html知识】用html写一个简单的个人网页 天若有情673 【html5+css】前端知识html前端
    介绍：这是一个HTML和CSS的代码段，它构建了一个基本的个人网页布局。以下是该代码的详细介绍：HTML部分：文档类型与基础结构：声明了文档类型为HTML5。定义了整个HTML文档，并设置语言为英语。头部信息：标签内包含了元数据，如字符集定义()，视口设置(<metaname="viewport"content="
  • 打卡55天------图论(并查集) 感谢上Di_123 前端算法题前端算法javascript
    图论这里我学的不是很好，作为一名JavaScript前端开发工程师，我能说我基本上在工作中都没用到过吗？一、并查集理论基础这个说句实话，我平常工作很少用到，上学的时候好像也没学过，可能我只是本科生吧，卡尔我他的简介的学历是硕士，还是要在知识上不断追求呀。并查集理论基础二、寻找存在的路径题目链接：卡码网题目描述：题目描述给定一个包含n个节点的无向图中，节点编号从1到n（含1和n）。你的任务是判断是否
  • 前端处理请求存在空内容、首尾空格的情况 mountainghost_z javascript开发语言ecmascript
    1.创建一个publicMethod.js（1）删除请求体value为空的情况exportfunctionremoveEmptyParams(params){for(varkeyinparams){if(params.hasOwnProperty(key)&&(params[key]===null||params[key]===undefined||params[key]==="")){delet
  • 2024最新（API 12）鸿蒙开发面试题-HarmonyOS Next 孤舟蓑影 HarmonyOSharmonyos华为typescript前端学习鸿蒙鸿蒙系统
    前端卷的不行，岗位也少，花了一个星期把HarmonyOS应用开发者基础认证和HarmonyOS应用开发者高级认证拿下了，但是是纯应付考试，实际开发经验还不足，网上搜也搜不到鸿蒙的面试题，有也是用AI瞎吉儿写的，不得已面了几家整理了下面试题和自己找的答案，除了概念性内容不要硬背，理解为主。希望鸿蒙开发能救我一条狗命吧/(ㄒoㄒ)/~~有大佬内推的请悄咪咪的联系我哦。现在的官网文档和特性更新很快很频繁
  • Vue.js：解锁前端开发的快速入门之旅 程序员-李旭亮 vue.js前端javascript
    标题：《Vue.js：解锁前端开发的快速入门之旅》在日新月异的Web开发领域中，Vue.js以其简洁、灵活和高效的特点，迅速成为前端开发者们的宠儿。对于初学者而言，Vue.js不仅是一个易于上手的框架，更是开启现代前端开发大门的金钥匙。本文将带您踏上一场Vue.js的快速入门之旅，探索其魅力所在，助您快速掌握这门强大的技术。一、初识Vue.js：轻量级与渐进式Vue.js，一个由尤雨溪（EvanY
  • 2020-04-22 解决了requests发送打包和flask接口接收并解析提取问题了 牛在A和C之间
    一、发送数据我想要的效果，我这边是一个人脸注册的前台，抠取人脸图像，加上注册时候输入的身份ID和手机号码，一起打包发送给我的后端Flask接口里面的解析函数一、首先我要写前端发送的代码#先定义后端flask的接口'解析data'jiexidata_url="http://xxx.xxx.xxx.xxx:xx/jiexidata"#我要发的数据以字典的形式先进行第一层封装，为何要以字典格式？想要发送
  • 利用electron和electron-builder把前端web项目生成桌面程序 shufan209 vueexe
    这里写自定义目录标题设置淘宝镜像建立electron工程文件1main.js2package.json3index.html安装依赖安装electron安装electron-builder预览electron项目打包electron项目关于electron，有兴趣的可以百度了解一下。为什么要写这篇文章呢？因为百度到的相关教程几乎也是作者摸索出来，只知道怎么做，却没具体说为什么这样，而且没有总结，还
  • 探索Zustand：简洁高效的状态管理新星 邹卿雅
    探索Zustand：简洁高效的状态管理新星zustandpmndrs/zustand:Zustand是一个轻量级的状态管理库，适用于React应用。它提供简单直观的API来创建和访问全局状态存储，并且鼓励简洁、灵活和可组合的状态解决方案。项目地址:https://gitcode.com/gh_mirrors/zu/zustand在JavaScript的前端世界中，状态管理一直是应用开发的核心话题。
  • Ovirt中的GWT框架 ctrlcvKing oivrt-engineoVirt虚拟化云计算
    参考文档：如何在ovirt中使用GWT框架为页面新增组件ovirt前端代码分析定位页面ovirt中的页面规则，以集群为例：集群列表页面MainClusterView.java，类似页面MainNetworkView.javaMainHostView.javatab页面SubTabClusterGeneralView.java类似页面SubTabHostGeneralView.java新建、修改、删
  • SpringBoot+Vue实现各种文件预览（附源码） Java学长小李 springbootvue.jselementuimysqlminio
    ‍作者简介：在笑大学牲️个人主页：无所谓^_^ps：点赞是免费的，却可以让写博客的作者开心好几天项目运行效果前言在做项目时，文件的上传和预览必不可少。继上篇介绍了minio的文件上传，本文将介绍如何实现文件预览功能。大家如果没看过上篇文章建议大家先看下。项目下载gitee：Springboot+vue实现小功能:Springboot+vue实现小功能（点个star呀）一、项目介绍技术栈前端：vue
  • 【前端知识整理】CSS布局 快速居中，两栏布局与三栏布局 EnoshSAGIRI csscss前端css3
    CSS中的各种布局方法1快速居中对齐的方法2两栏布局2.1左列定宽右列自适应2.1.1浮动+margin方法2.1.2浮动+BFC2.1.3定位（子绝父相）2.1.4flex2.1.5浮动+负外边距2.1.6table2.2左列不定宽右列自适应3三栏布局3.1浮动+margin3.2浮动+BFC3.3flex3.4table3.5定位3.6圣杯布局3.7双飞翼布局3.8grid1快速居中对齐的方法
  • 王者荣耀官网首页（xd原文件） 无名指的等待712 HTML5css3xd前端
    1web前端开发者链接：https://pan.baidu.com/s/1nl9XmiyWnMs9gPCP1sN-3w提取码：hhss本文件是王者荣耀官网首页的XD源文件，玩游戏不如自己创造一个游戏。本文件可以锻炼一下大家的HTML5和css3的基础功底。
  • 前端HTML相关知识 Xiao Tong333 html前端
    1.什么是HTMLHTML指的是超文本标记语言(HyperTextMarkupLanguage)。超文本:是指页面内可以包含图片、链接、声音,视频等内容标记:标签(通过标记符号来告诉浏览器网页内容该如何显示)浏览器根据不同的HTML标签，解析成我们看到的网页2.HTML的特点HTML不是编程语言，而是标记语言。HTML使用标签的形式来标识网页的不同组成部分HTML文档包含了HTML标签和文本HTM
  • web报表工具FineReport常见的数据集报错错误代码和解释 老A不折腾 web报表finereport代码可视化工具
    在使用finereport制作报表，若预览发生错误，很多朋友便手忙脚乱不知所措了，其实没什么，只要看懂报错代码和含义，可以很快的排除错误，这里我就分享一下finereport的数据集报错错误代码和解释，如果有说的不准确的地方，也请各位小伙伴纠正一下。   NS-war-remote=错误代码\:1117 压缩部署不支持远程设计 NS_LayerReport_MultiDs=错误代码
  • Java的WeakReference与WeakHashMap bylijinnan java弱引用
    首先看看 WeakReference wiki 上 Weak reference 的一个例子： public class ReferenceTest { public static void main(String[] args) throws InterruptedException { WeakReference r = new Wea
  • Linux——（hostname）主机名与ip的映射 eksliang linuxhostname
    一、 什么是主机名 无论在局域网还是INTERNET上，每台主机都有一个IP地址，是为了区分此台主机和彼台主机，也就是说IP地址就是主机的门牌号。但IP地址不方便记忆，所以又有了域名。域名只是在公网（INtERNET)中存在，每个域名都对应一个IP地址，但一个IP地址可有对应多个域名。域名类型 linuxsir.org 这样的； 主机名是用于什么的呢？ 答：在一个局域网中，每台机器都有一个主
  • oracle 常用技巧 18289753290
    oracle常用技巧 ①复制表结构和数据   create table  temp_clientloginUser as   select distinct userid from tbusrtloginlog ②仅复制数据 如果表结构一样 insert into  mytable  select  * &nb
  • 使用c3p0数据库连接池时出现com.mchange.v2.resourcepool.TimeoutException 酷的飞上天空 exception
    有一个线上环境使用的是c3p0数据库，为外部提供接口服务。最近访问压力增大后台tomcat的日志里面频繁出现 com.mchange.v2.resourcepool.TimeoutException: A client timed out while waiting to acquire a resource from com.mchange.v2.resourcepool.BasicResou
  • IT系统分析师如何学习大数据 蓝儿唯美 大数据
    我是一名从事大数据项目的IT系统分析师。在深入这个项目前需要了解些什么呢？学习大数据的最佳方法就是先从了解信息系统是如何工作着手，尤其是数据库和基础设施。同样在开始前还需要了解大数据工具，如Cloudera、Hadoop、Spark、Hive、Pig、Flume、Sqoop与Mesos。系 统分析师需要明白如何组织、管理和保护数据。在市面上有几十款数据管理产品可以用于管理数据。你的大数据数据库可能
  • spring学习——简介 a-john spring
    Spring是一个开源框架，是为了解决企业应用开发的复杂性而创建的。Spring使用基本的JavaBean来完成以前只能由EJB完成的事情。然而Spring的用途不仅限于服务器端的开发，从简单性，可测试性和松耦合的角度而言，任何Java应用都可以从Spring中受益。其主要特征是依赖注入、AOP、持久化、事务、SpringMVC以及Acegi Security 为了降低Java开发的复杂性，
  • 自定义颜色的xml文件 aijuans xml
    <?xml version="1.0" encoding="utf-8"?> <resources> <color name="white">#FFFFFF</color> <color name="black">#000000</color> &
  • 运营到底是做什么的？ aoyouzi 运营到底是做什么的？
    文章来源：夏叔叔（微信号：woshixiashushu），欢迎大家关注！很久没有动笔写点东西，近些日子，由于爱狗团产品上线，不断面试，经常会被问道一个问题。问：爱狗团的运营主要做什么？答：带着用户一起嗨。为什么是带着用户玩起来呢？究竟什么是运营？运营到底是做什么的？那么，我们先来回答一个更简单的问题——互联网公司对运营考核什么？以爱狗团为例，绝大部分的移动互联网公司，对运营部门的考核分为三块——用
  • js面向对象类和对象 百合不是茶 js面向对象函数创建类和对象
    接触js已经有几个月了,但是对js的面向对象的一些概念根本就是模糊的,js是一种面向对象的语言 但又不像java一样有class,js不是严格的面向对象语言 ,js在java web开发的地位和java不相上下  ,其中web的数据的反馈现在主流的使用json,json的语法和js的类和属性的创建相似   下面介绍一些js的类和对象的创建的技术   一:类和对
  • web.xml之资源管理对象配置 resource-env-ref bijian1013 javaweb.xmlservlet
    resource-env-ref元素来指定对管理对象的servlet引用的声明，该对象与servlet环境中的资源相关联 <resource-env-ref> <resource-env-ref-name>资源名</resource-env-ref-name> <resource-env-ref-type>查找资源时返回的资源类
  • Create a composite component with a custom namespace sunjing
    https://weblogs.java.net/blog/mriem/archive/2013/11/22/jsf-tip-45-create-composite-component-custom-namespace   When you developed a composite component the namespace you would be seeing would
  • 【MongoDB学习笔记十二】Mongo副本集服务器角色之Arbiter bit1129 mongodb
     一、复本集为什么要加入Arbiter这个角色 回答这个问题，要从复本集的存活条件和Aribter服务器的特性两方面来说。 什么是Artiber？ An arbiter does not have a copy of data set and cannot become a primary. Replica sets may have arbiters to add a
  • Javascript开发笔记 白糖_ JavaScript
    获取iframe内的元素 通常我们使用window.frames["frameId"].document.getElementById("divId").innerHTML这样的形式来获取iframe内的元素，这种写法在IE、safari、chrome下都是通过的，唯独在fireforx下不通过。其实jquery的contents方法提供了对if
  • Web浏览器Chrome打开一段时间后，运行alert无效 bozch Webchormealert无效
    今天在开发的时候，突然间发现alert在chrome浏览器就没法弹出了，很是怪异。 试了试其他浏览器，发现都是没有问题的。 开始想以为是chorme浏览器有啥机制导致的，就开始尝试各种代码让alert出来。尝试结果是仍然没有显示出来。 这样开发的结果，如果客户在使用的时候没有提示，那会带来致命的体验。哎，没啥办法了 就关闭浏览器重启。   结果就好了，这也太怪异了。难道是cho
  • 编程之美-高效地安排会议 图着色问题 贪心算法 bylijinnan 编程之美
    import java.util.ArrayList; import java.util.Collections; import java.util.List; import java.util.Random; public class GraphColoringProblem { /**编程之美 高效地安排会议 图着色问题 贪心算法 * 假设要用很多个教室对一组
  • 机器学习相关概念和开发工具 chenbowen00 算法matlab机器学习
    基本概念： 机器学习(Machine Learning, ML)是一门多领域交叉学科，涉及概率论、统计学、逼近论、凸分析、算法复杂度理论等多门学科。专门研究计算机怎样模拟或实现人类的学习行为，以获取新的知识或技能，重新组织已有的知识结构使之不断改善自身的性能。 它是人工智能的核心，是使计算机具有智能的根本途径，其应用遍及人工智能的各个领域，它主要使用归纳、综合而不是演绎。 开发工具 M
  • [宇宙经济学]关于在太空建立永久定居点的可能性 comsci 经济
           大家都知道,地球上的房地产都比较昂贵,而且土地证经常会因为新的政府的意志而变幻文本格式........        所以,在地球议会尚不具有在太空行使法律和权力的力量之前,我们外太阳系统的友好联盟可以考虑在地月系的某些引力平衡点上面,修建规模较大的定居点
  • oracle 11g database control 证书错误 daizj oracle证书错误oracle 11G 安装
    oracle 11g database control 证书错误  win7 安装完oracle11后打开 Database control 后，会打开em管理页面，提示证书错误，点“继续浏览此网站”，还是会继续停留在证书错误页面 解决办法： 是 KB2661254 这个更新补丁引起的，它限制了 RSA 密钥位长度少于 1024 位的证书的使用。具体可以看微软官方公告：
  • Java I/O之用FilenameFilter实现根据文件扩展名删除文件 游其是你 FilenameFilter
    在Java中，你可以通过实现FilenameFilter类并重写accept(File dir, String name) 方法实现文件过滤功能。 在这个例子中，我们向你展示在“c:\\folder”路径下列出所有“.txt”格式的文件并删除。 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16
  • C语言数组的简单以及一维数组的简单排序算法示例，二维数组简单示例 dcj3sjt126com carray
    # include <stdio.h> int main(void) { int a[5] = {1, 2, 3, 4, 5}; //a 是数组的名字 5是表示数组元素的个数，并且这五个元素分别用a[0], a[1]...a[4] int i; for (i=0; i<5; ++i) printf("%d\n",
  • PRIMARY, INDEX, UNIQUE 这3种是一类 PRIMARY 主键。 就是 唯一 且 不能为空。 INDEX 索引，普通的 UNIQUE 唯一索引 dcj3sjt126com primary
    PRIMARY, INDEX, UNIQUE 这3种是一类PRIMARY 主键。 就是 唯一 且 不能为空。INDEX 索引，普通的UNIQUE 唯一索引。 不允许有重复。FULLTEXT 是全文索引，用于在一篇文章中，检索文本信息的。举个例子来说，比如你在为某商场做一个会员卡的系统。这个系统有一个会员表有下列字段：会员编号   INT会员姓名  
  • java集合辅助类 Collections、Arrays shuizhaosi888 CollectionsArraysHashCode
      Arrays、Collections   1 ）数组集合之间转换 public static <T> List<T> asList(T... a) { return new ArrayList<>(a); }      a）Arrays.asL
  • Spring Security（10）——退出登录logout 234390216 logoutSpring Security退出登录logout-urlLogoutFilter
           要实现退出登录的功能我们需要在http元素下定义logout元素，这样Spring Security将自动为我们添加用于处理退出登录的过滤器LogoutFilter到FilterChain。当我们指定了http元素的auto-config属性为true时logout定义是会自动配置的，此时我们默认退出登录的URL为“/j_spring_secu
  • 透过源码学前端 之 Backbone 三 Model 逐行分析JS源代码 backbone源码分析js学习
    Backbone 分析第三部分  Model 概述： Model 提供了数据存储，将数据以JSON的形式保存在 Model的 attributes里， 但重点功能在于其提供了一套功能强大，使用简单的存、取、删、改数据方法，并在不同的操作里加了相应的监听事件， 如每次修改添加里都会触发 change，这在据模型变动来修改视图时很常用，并且与collection建立了关联。
  • SpringMVC源码总结（七）mvc:annotation-driven中的HttpMessageConverter 乒乓狂魔 springMVC
    这一篇文章主要介绍下HttpMessageConverter整个注册过程包含自定义的HttpMessageConverter，然后对一些HttpMessageConverter进行具体介绍。 HttpMessageConverter接口介绍： public interface HttpMessageConverter<T> { /** * Indicate
  • 分布式基础知识和算法理论 bluky999 算法zookeeper分布式一致性哈希paxos
      分布式基础知识和算法理论 BY [email protected] 本文永久链接：http://nodex.iteye.com/blog/2103218   在大数据的背景下，不管是做存储，做搜索，做数据分析，或者做产品或服务本身，面向互联网和移动互联网用户，已经不可避免地要面对分布式环境。笔者在此收录一些分布式相关的基础知识和算法理论介绍，在完善自我知识体系的同
  • Android Studio的.gitignore以及gitignore无效的解决 bell0901 androidgitignore
    　　github上.gitignore模板合集，里面有各种.gitignore ： https://github.com/github/gitignore 　　自己用的Android Studio下项目的.gitignore文件，对github上的android.gitignore添加了 　　　　　　# OSX files　　　　　　//mac os下　　　　　　.DS_Store
  • 成为高级程序员的10个步骤 tomcat_oracle 编程
    What 软件工程师的职业生涯要历经以下几个阶段：初级、中级，最后才是高级。这篇文章主要是讲如何通过 10 个步骤助你成为一名高级软件工程师。   Why 得到更多的报酬！因为你的薪水会随着你水平的提高而增加 提升你的职业生涯。成为了高级软件工程师之后，就可以朝着架构师、团队负责人、CTO 等职位前进 历经更大的挑战。随着你的成长，各种影响力也会提高。
  • mongdb在linux下的安装 xtuhcy mongodblinux
    一、查询linux版本号： lsb_release -a  LSB Version:    :base-4.0-amd64:base-4.0-noarch:core-4.0-amd64:core-4.0-noarch:graphics-4.0-amd64:graphics-4.0-noarch:printing-4.0-amd64:printing-4.0-noa
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他