web项目小总结
初步小结
1.之前的CSS有些遗忘，返回去重新看知识点，频繁会浪费项目时间。
比如说：
position定位
1 position: absolute;//绝对定位
2 position:relative;//相对定位，一般给父div设置，让子div在里面定位
2.样式属性写的有些乱
每个选择器写相对应的属性样式，div设置宽高
3.JS和JQ的DOM操作不够熟练，比如获取元素上，思考的不够准确，
4.写代码时一定要先想清楚做什么，想要效果是什么，怎么做 ，用什么来实现，一步一步来，
5.this的使用，参数传值，不够熟练，
6.JQ操作里的eq()方法将匹配元素集缩减值指定 index 上的一个。
例子：
<!DOCTYPE html>
<html>
<head>
<style>
div { width:60px; height:60px; margin:10px; float:left;
border:2px solid blue; }
.blue { background:blue; }
</style>
<script type="text/javascript" src="/jquery/jquery.js"></script>
</head> <body>
<ul>
<li>list item 1</li>
<li>list item 2</li>
<li>list item 3</li>
<li>list item 4</li>
<li>list item 5</li>
</ul> <script>$('li').eq(2).css('background-color', 'red');//取第三个li,修改背景</script>
</body>
</html>
结果：
如果提供负数，则指示从集合结尾开始的位置，而不是从开头开始
7.$(this).index()，在编写选项卡及轮播图等特效时经常用到
从0开始
例子：
场景一： 同级元素标签相同
html代码：
<ul>
<li>one</li>
<li>two</li>
<li>three</li>
<li>four</li>
</ul>
jq代码：
// $(this).index() 测试代码一
$("li").on("click",function(){
var index = $(this).index();
console.log(index); // 依次点击li元素输出： 0,1,2,3
})
// $(obj).index(this) 测试代码二
$("li").on("click",function(){
var index = $("li").index(this);
console.log(index); // 依次点击li元素输出： 0,1,2,3
})
执行两段脚本并依次点击li元素，都是输出： 0/1/2/3，在这个场景下，作用一样。
场景二：同级元素标签不相同
html代码：
<div>
<p>this is span</p>
<p>this is span</p>
<b>this is b</b>
<b>this is b</b>
</div>
jq代码：
// $(this).index() 测试代码一
$("b").on("click",function(){
var index = $(this).index();
console.log(index); // 依次点击b元素输出:2,3
})
// $(obj).index(this) 测试代码二
$("b").on("click",function(){
var index = $("b").index(this);
console.log(index); // 依次点击b元素输出:2,3
})
测试代码一中，index()是元素在当前同级元素中的位置下标，不区分标签；
测试代码二中，返回值是当前操作元素（this）在$（"b"）集合中的下标。$( "b" )是jQuery对象集合，所以非同级元素也可以使用
web项目小总结的更多相关文章
- 百度开放云java+tomcat部署web项目-小皇帝詹姆斯
加入部署 watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/diss ...
- 转载：eclipse中web项目小地球没了
转载自:{FROM:http://www.cnblogs.com/zhouyalei/archive/2013/01/30/2882651.html} MyEclipse下创建的项目 导入eclips ...
- IDEA web项目小坑
1.明明依赖包都加进来了,为什么运行起来报java.lang.ClassNotFoundException? 依赖包的路径只能为{project}web/WEB-INF/lib,如果将lib改为lib ...
- tomcat部署java web项目遇到的一些小问题
背景:本人不是Java开发人员,经过四年多的历练,可以说是一枚BI攻城师了吧,最近粗糙的写了一个Portal来集成cognos报表,下面就入正题说一下发布过程中遇到的小问题吧. a:前提:Java w ...
- Java Web项目，Android和微信小程序的初始页面配置
Java Web项目 我们在Eclipse里开了Java Web项目之后,Run As Tomcat或者Apache服务器,本地运行,如果直接用http://localhost:8080访问项目,会发 ...
- 空 Maven项目转成 Web项目 & SpringMVC调用其他 Module中的方法可能会遇到的小问题
SpringMVC调用其他 模块内的方法的 坑 下次别在阴沟里翻船啦.. 一共花费 4个小时,解决项目中的这个问题 OMG 1. 首先是 Maven新建工程 一般使用 Maven都是先创建 空工程 当 ...
- 主要介绍JavaEE中Maven Web 项目的结构及其它几个小问题
先说下本篇随笔的目录. 1.介绍windows中环境变量Path与ClassPath的区别. 2.可能导致命令行运行javac编译成功,但 java命令 + 所要执行的类的类名 无效的原因. 3.介绍 ...
- 在基于MVC的Web项目中使用Web API和直接连接两种方式混合式接入
在我之前介绍的混合式开发框架中,其界面是基于Winform的实现方式,后台使用Web API.WCF服务以及直接连接数据库的几种方式混合式接入,在Web项目中我们也可以采用这种方式实现混合式的接入方式 ...
- 使用EXtjs6.2构建web项目
一.项目简介 众所周知ext是一款非常强大的表格控件,尤其是里边的grid为用户提供了非常多的功能,现在主流的还是用extjs4.0-4.2,但是更高一点的版本更加符合人的审美要求.因此,在今天咱们构 ...
随机推荐
- Mysql实例参数优化15个主要参数讲解(原创)
1.innodb_buffer_pool_size 设置物理内存的60%-80%,反应IO吞吐的最大上限2.innodb_thread_concurrency 线程并发,设置为CPU核心数,如果等于0 ...
- k8s集群新增节点
节点为centos7.4 一.node节点基本环境配置 1.配置主机名 2.配置hosts文件(master和node相互解析) 3.时间同步 ntpdate pool.ntp.org date ec ...
- POJ1031 Fence
题目来源:http://poj.org/problem?id=1031 题目大意: 有一个光源位于(0,0)处,一个多边形的围墙.围墙是“全黑”的,不透光也不反射光.距光源r处的光强度为I0=k/r, ...
- servlet获取并存储web.xml中context-param参数
在web.xml中定义了context-param,一般不会随意改动,所以在监听器中做一次处理,容器启动时读取并存储在Properties中,方便以后取值. SysProperties 类用于存储 c ...
- 备份当前的ubuntu系统生成iso
使用respin,步骤如下: sudo add-apt-repository ppa:sergiomejia666/respin sudo apt-get update sudo apt-get in ...
- Unity SceneManager 对场景的操作
用 SceneManager 之前要引用using UnityEngine.SceneManagement; 命名空间. 1.拿到当前场景的名字:SceneManager.GetActiveScene ...
- JAVA多线程之Volatiles
Java 语言中的 volatile 变量可以被看作是一种 “轻量级的 synchronized”:与 synchronized 块相比,volatile 变量所需的编码较少,并且运行时开销也较少,但 ...
- 在Scala IDEA for Eclipse或IDEA里程序编译实现与在Spark Shell下的对比（其实就是那么一回事）
不多说,直接上干货! 比如,我这里拿主成分分析(PCA). 1.主成分分析(PCA)的概念介绍 主成分分析(PCA) 是一种对数据进行旋转变换的统计学方法,其本质是在线性空间中进行一个基变换,使得变换 ...
- 关于response.write(alert(''))弹窗改变页面格式问题
不建议使用 Response.Write("<script>alert('增加年级失败')</script>"); 而使用 Page.ClientScrip ...
- webpack4流程笔记
初始化 mkdir webpack-demo ->新建文件夹 cd webpack-demo ->进入文件夹 第一步 npm init -y -> 初始化项目(生成pack ...