下载 >  移动开发 >  HTML5 > JS学习笔记相关代码-测试代码

JS学习笔记相关代码-测试代码 评分:

JS学习笔记相关文档 Login.html学习 placeholder 属性规定可描述输入字段预期值的简短的提示信息(比如:一个样本值或者预期格式的短描述)。 该提示会在用户输入值之前显示在输入字段中。 注意:placeholder 属性适用于下面的 input 类型:text、search、url、tel、email和password。 测试样例参见test/placeholder.html 局部刷新 class="toolbar clearfix" ToolBar  隐藏掉系统原先的导航栏 clearfix 主要是用在浮动层的父层,而 clear 主要是用在浮动层与浮动层之间,和浮动层同一级,如果想要撑开父层的高度,clear 就要放 在最后。 Bootstrap 模态框(Modal)插件 模态框(Modal)是覆盖在父窗体上的子窗体。通常,目的是显示来自一个单独的源的内容,可以在不离开父窗体的情况下有一些互动。子窗体可提供信息、交互等。 如果需要引用该插件功能,需要引入modal.js OR bootstrap.js OR bootstrap.min.js 用法:通过 data 属性在控制器元素(比如按钮或者链接)上设置属性data-toggle="modal",同时设置 data-target="#identifier"或href="#identifier"来指定要切换的特定的模态框(带有 id="identifier")。 测试样例参见test/Modal.html function($) javascript中(function($){...})(jQuery)写法是指的是是匿名函数。 function(arg){...}这也定义了一个匿名函数,参数为arg。 测试样例参见test/AnonymousFunction.html .navbar-fixed-top使导航条固定在顶部 Index.html学习 Font Awesome 图标 Font Awesome 是一套绝佳的图标字体库和CSS框架。 Font Awesome 字体为您提供可缩放矢量图标,它可以被定制大小、颜色、阴影以及任何可以用CSS的样式。 如果需要该插件功能,需要引入font-awesome.css OR font-awesome.min.css <!DOCTYPE html> &lt;html&gt; &lt;head&gt; &lt;link rel="stylesheet" href="https://cdn.staticfile.org/font-awesome/4.7.0/css/font-awesome.css"&gt; &lt;/head&gt; &lt;body&gt; <i class="fa fa-car"></i> <i class="fa fa-car" <i class="fa fa-car" &lt;/body&gt; &lt;/html&gt; 测试样例参见test/tubiao.html 1、列表图标 <ul class="fa-ul"> <li><i class="fa-li fa fa-check-square"></i>List icons</li> <li><i class="fa-li fa fa-spinner fa-spin"></i>List icons</li> <li><i class="fa-li fa fa-square"></i>List icons</li> </ul> 2、动态图标 <i class="fa fa-spinner fa-spin"></i> <i class="fa fa-circle-o-notch fa-spin"></i> <i class="fa fa-refresh fa-spin"></i> <i class="fa fa-cog fa-spin"></i> <i class="fa fa-spinner fa-pulse"></i> 3、旋转和翻转的图标 <i class="fa fa-shield"></i> <i class="fa fa-shield fa-rotate-90"></i> <i class="fa fa-shield fa-rotate-180"></i> <i class="fa fa-shield fa-rotate-270"></i> <i class="fa fa-shield fa-flip-horizontal"></i> <i class="fa fa-shield fa-flip-vertical"></i> 4、图标抖动√ &lt;!-- 测试图标抖动--&gt; 测试<i class="ace-icon fa fa-envelope icon-animated-vertical"></i> <p> 经测试:图标抖动与bootstrap.min.css;font-awesome.min.css;ace.min.css相关联</p> 测试样例参见test/tubiao2.html PS:fa-angle-double-down双箭头向下指示的图标,展开操作时用。 任务折叠+进度控制 主要是li标签的循环嵌套,浮于上层的列表需要引入jquery-2.1.4.min.js,bootstrap.min.js以使用dropdown等属性实现展开与折叠特性 进度控制, 除了使用<div class="progress-bar progress-bar-success"></div>直接控制进度条的长度外,还可以使用如下功能: <progress value="50" max="100"></progress>以实现进度条的变更控制,从后台获取数据,并计算其百分比并显示在前端。 分别使用progress-bar,progress-bar-warning,progress-bar-danger,progress-bar-success表示其安全与否等级。 测试样例分别参见test/liTag.html, test/progress.html 评论与回复 评论区的滚动:设置定量高度,在文字被排满的情下,自动加入滚动条 <div class="test"></div> &lt;input type="text" id="test"/&gt;&lt;input type='button' value='提交' [removed] function fun(){ var str = document.getElementById("test").value; var divs = document.getElementsByTagName("div"); for(i=0;i<divs.length;i++){ if(divs[i].className == "test"){ divs[i][removed] += "" +str+"</br>"; } }} [removed] 可实现评论提交功能。 也可通过与后台交互的方式,如发送post请求,提交给后台,后台审核通过后,通过servlet机制再传送给前端。 测试样例分别参见test/comment.html, test/comment2.html
...展开详情收缩
2019-06-05 上传大小:4.43MB
分享
收藏 举报
Js学习笔记
js学习笔记
Javascript学习笔记(传智播客视频学习笔记+代码

Javascript个人学习笔记:基于传智播客的web前端培训视频所做的笔记以及相关的代码,比较基础全面的Javascript入门知识

立即下载
js学习笔记、个人学习心得

自己学习js的体会!js笔记!js学习笔记、个人学习心得

立即下载
dojo学习笔记

dojo学习笔记,dojo,js,javascript,dojo学习

立即下载
javascript学习笔记2

js基础学习笔记 --------字符串与事件对象总结

立即下载
JS AngularJS 学习笔记

JS AngularJS 学习笔记 YouTube视频截图

立即下载
Cocos2d-x学习笔记——完全掌握JS API与游戏项目开发

分享给大家。高清,有些配图也许会黑掉,但文字是肯定清晰的。请放心下载

立即下载
JS学习笔记

JS学习笔记,说明比较常用的东西,对刚刚接触JS的人非常有用

立即下载
js宝典学习笔记,记录JAVA SCRIPT宝典中的内容

js宝典学习笔记,记录JAVA SCRIPT宝典中的内容.txt

立即下载
javascript 详细笔记

很不错的js学习笔记,相信能让你收获很大。

立即下载
jQuery学习资源包

jQuery学习资源包,包括帮助文档,学习笔记,js文件等

立即下载
js、jp遍历对象以及数据的方式

js、jp遍历对象以及数组,本人手写学习笔记!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!

立即下载
正则表达式学习笔记

正则表达式学习笔记,内容详细容易操作,sqlserver java js c++

立即下载
Struts2 笔记代码

Struts2 学习笔记的相关代码

立即下载
jasperreport学习例子代码

jasperreport 学习笔记 例子代码jasperreport 学习笔记 例子代码jasperreport 学习笔记 例子代码jasperreport 学习笔记 例子代码jasperreport 学习笔记 例子代码jasperreport 学习笔记 例子代码jasperreport 学习笔记 例子代码

立即下载
传智播客JS笔记

笔记做的很详细,通俗易懂,结合js代码讲解的,对初学javascript的很有用的

立即下载
ext学习笔记代码

ext学习笔记代码 ext学习笔记代码 ext学习笔记代码

立即下载
JS学习笔记(全)

javascript学习笔记,包括基本语法、面向对象、正则表达式、dom的所有操作

立即下载
C#6.0学习笔记随书代码

C#6.0

立即下载

热点文章

img

spring mvc+mybatis+mysql+maven+bootstrap 整合实现增删查改简单实例.zip

资源所需积分/C币 当前拥有积分 当前拥有C币
5 0 0
点击完成任务获取下载码
输入下载码
为了良好体验,不建议使用迅雷下载
img

JS学习笔记相关代码-测试代码

会员到期时间: 剩余下载个数: 剩余C币: 剩余积分:0
为了良好体验,不建议使用迅雷下载
VIP下载
您今日下载次数已达上限(为了良好下载体验及使用,每位用户24小时之内最多可下载20个资源)

积分不足!

资源所需积分/C币 当前拥有积分
您可以选择
开通VIP
4000万
程序员的必选
600万
绿色安全资源
现在开通
立省522元
或者
购买C币兑换积分 C币抽奖
img

资源所需积分/C币 当前拥有积分 当前拥有C币
5 4 45
为了良好体验,不建议使用迅雷下载
确认下载
img

资源所需积分/C币 当前拥有积分 当前拥有C币
5 0 0
为了良好体验,不建议使用迅雷下载
VIP和C币套餐优惠
img

资源所需积分/C币 当前拥有积分 当前拥有C币
5 4 45
您的积分不足,将扣除 10 C币
为了良好体验,不建议使用迅雷下载
确认下载
下载
您还未下载过该资源
无法举报自己的资源

兑换成功

你当前的下载分为234开始下载资源
你还不是VIP会员
开通VIP会员权限,免积分下载
立即开通

你下载资源过于频繁,请输入验证码

您因违反CSDN下载频道规则而被锁定帐户,如有疑问,请联络:webmaster@csdn.net!

举报

  • 举报人:
  • 被举报人:
  • *类型:
    • *投诉人姓名:
    • *投诉人联系方式:
    • *版权证明:
  • *详细原因: