BS总结
前沿：
BS的学习让我们从控制控件的操作和属性变成了我们自己编写和调用控件然后所有的事件都是我们自己编写的。在这个过程中，我们更加了解了整个事物的运行的流程。
下面跟随小编来看看有哪些知识点
1 B/S 和 C/S 之间的区别
个人就目前的经验认为 c/s 就是客户端和服务器，也就是服务器连接的程序可以让客户端上的用户进行使用，一般是app 或者是其他的可执行程序。客户端和服务器之间的联系是数据库连接。
而b/s就是brower浏览器和服务器之间的关系，页面经过了web服务器的发布之后，只要知道url，在访问域内的机器就可以通过http阅读协议进行查看发布的内容。浏览器和服务器之间的联系是http阅读协议，进行文本信息的可查阅。
- 各个项目的知识点的总结
-
牛腩新闻发布系统
真假分页
假分页： 从数据库中一次性算则所有数据，在将数据按照页数进行显示。
代码：
真分页： 从数据库中只选择当前页的数据，跳转到下一页的时候，再次进行申请。
代码：
需要控件
建立存储过程：
<span style="font-size:18px;">-- =============================================
-- Author: <RU>
-- Create date: <2015-05-17>
-- Description: <新闻分页>
-- =============================================
ALTER PROCEDURE [dbo].[procNewsSelectPage]
@start integer,
@end integer
AS
BEGIN
with tempt as (
select ROW_NUMBER() over(order by id desc)as row,*from news T)
select * from tempt where row between @start and @end
SET NOCOUNT ON;
END</span>
DAL层调用存储过程：（B层引用D层）
<span style="font-size:18px;"> #region 新闻分页显示
public DataTable SelectPage(int start, int end)
{
DataTable dt = new DataTable();
string cmdText = "procNewsSelectPage";
SqlParameter[] paras = new SqlParameter[]{
new SqlParameter("@start",start),
new SqlParameter("@end",end)
};
dt = sqlhelper.ExecuteQuery(cmdText, paras, CommandType.StoredProcedure);
return dt;
}
#endregion</span>
Web层：
在新闻管理newsmanager.aspx中编写如下代码：设置分页控件的样式
<span style="font-size:18px;">
<webdiyer:AspNetPager ID="anp" runat="server" FirstPageText="首页" LastPageText="尾页" NextPageText="下一页" PrevPageText="上一页" OnPageChanged="anp_PageChanged" PageSize="5" AlwaysShow="true">
</webdiyer:AspNetPager></span>
在新闻管理newsmanager.aspx.cs后台编写如下代码：
<span style="font-size:18px;">protected void Page_Load(object sender, EventArgs e)
{
//判断session里面是否存在管理员
if (Session["admin"] != null && Session["admin"].ToString() == "ru")
{
//已登录
if (!Page.IsPostBack)
{
DataTable dt = new DataTable();
dt = new NewsManager().SelectAll();
anp.RecordCount = dt.Rows.Count;
BindNews();
}
}
else
{
//未登录
Response.Redirect("login.aspx");
}
}
#region 绑定新闻列表
private void BindNews()
{
int start = anp.StartRecordIndex;
int end = anp.EndRecordIndex;
repNews.DataSource = new NewsManager().SelectPage(start, end);
repNews.DataBind();
}
#endregion
protected void anp_PageChanged(object sender, EventArgs e)
{
BindNews();
} </span>
触发器
Html
标签
定义字符集编码<meta charset="utf-8">
刷新或者跳转<meta http-equiv="refresh" content="3;url=http://www.baidu.com" >过3秒跳到百度
设置关键字<meta name="keywords" content="">
设置页面描述<meta name="description" content="">
定义网站标题图标<link rel="shortcut icon" href="图片地址.ico">（各种图标可以到icon网上找）
表单
form属性有action、method、target、enctype
- <form action="http://www.baidu.com/s" method="get">
Get post
如下情况使用GET方法：客户端与服务端的交互像是一个提问(如查询操作、搜索操作、读操作) ，当传递的数据是字段的时候。get的信息虎出现在url中。
如下情况使用POST方法：
1.交互是一个命令或订单(order)，比提问包含更多信息，当传递的信息是一个对象整体的时候
2.交互改变了服务器端的资源并被用户察觉，例如订阅某项服务
3.用户需要对交互产生的结果负责
表格的形成
type属性 submit（默认）、reset（撤销）、button 【注意：必须在同一个表单中才能进行按钮的操作】
XML
一些基本的知识点：
1：xml被设计用来传输和存储数据 html被用来显示数据
2：xml是树结构
3：所有元素必须有关闭标签
4：对大小写敏感
5：必须要有一个根元素
6：属性值必须加引号 尽量避免使用属性 而是使用元素
CSS
ID选择器
对于ID大家其实并不陌生，一个元素的ID是唯一的，而且这个选择是在CSS中经常使用，而且具有较高的级别，一般在CSS中编写使用“#”代表。
例如：
#search {
height: 27px;
}
<div id="searchres" >
</div>
2、类别选择器
说起类（class）他可是很出名的，而这里的类别选择器也是常用的选择器之一，用class表示，在CSS中，使用“.”进行表示。
例如：
.search {
height: 27px;
}
<div class="searchres" >
</div>
3、标签选择器
首先要知道什么是标签？
答：标签限定了文档的开始和结束点，在他们之间是文档的头部与主体。例如：p标签，a标签等等
例如：
li{
text-align:center;
margin:20px;
}
<li><a href="#">首 页</a></li>
<li><a href="#">体育新闻</a></li>
<li><a href="#">财经新闻</a></li>
<li><a href="#">社会新闻</a></li>
4、后代选择器
后代选择器也称为包含选择器，用来选择特定元素或元素组的后代，将对父元素的选择放在前面，对子元素的选择放在后面，中间加一个空格分开。后代选择器中的元素不仅仅有两个，也可以是多个，这个和口头上说的后代有相同的含义。
例如：
#newscontent .con{
text-indent:2em;/*让段落首行缩进2个字符*/
line-height:20px;/*行间距*/
}
<div id="newscontent" class="commonfrm">
<p>
<asp:Label ID="lblContent" runat="server" Text=""></asp:Label>
</p>
</div>
有这么多的选择器，在使用的时候又是如何区分他们的等级的呢？
优先级：ID选择器 > 类选择器 > 标签
后代选择器一般要根据它是由那几个选择器一起使用的。
PS：当样式出现矛盾的时候，与css样式的排列顺序有关系，以后面的顺序为主
盒子模型
元素的类型与转换
块元素
独自占据一行或者多行
可设置宽高，对齐等属性
可容纳其他的行内元素和块级元素
行元素
和其他的行内元素都在同一行上显示，不会独自换行
宽度就是它文字或者图片的宽度
设置高度height**无效**（对其他的元素排列没有影响），可通过line-heigh设置
设置内外边距只有左右的生效
只能容纳文本或者其他的行内元素（块元素不做显示，如img ）
img、input可以设置宽高，理解为行内块元素
span、strong、a、del。。。
行内元素可以嵌套在块元素中使用，而块元素却不能嵌套在行内元素中
span
span标记在CSS属于一个行内元素，标记之间只能包含文本和各种行内标记
当对他应用样式时，才会产生视觉上的变化，div为大容器span是小容器，大容器可以放置小容器
JQUery
http://www.runoob.com/jquery/jquery-events.html
jQuery是一个JavaScript函数库。
jQuery是一个轻量级的"写的少，做的多"的JavaScript库。
jQuery库包含以下功能：
- HTML 元素选取
- HTML 元素操作
- CSS 操作
- HTML 事件函数
- JavaScript 特效和动画
- HTML DOM 遍历和修改
- AJAX
- Utilities
常见 DOM 事件：
| 鼠标事件 |
键盘事件 |
表单事件 |
文档/窗口事件 |
创建XMLHttpRequest对象
function createXMLHttpRequest()
{if(window.XMLHttpRequest){// DOM 2浏览器XMLHttpReq = new XMLHttpRequest();}
else if (window.ActiveXObject)
{
// IE浏览器
try
{XMLHttpReq = new ActiveXObject("Msxml2.XMLHTTP");}catch (e){
try
{XMLHttpReq = new ActiveXObject("Microsoft.XMLHTTP");}catch (e) {
}
}
}
}
AJAX
机制：
AJAX引擎允许用户与应用软件之间的交互过程异步进行，独立于用户与网络服务器间的交流。现在，可以用Javascript调用AJAX引擎来代替产生一个HTTP的用户动作，内存中的数据编辑、页面导航、数据校验这些不需要重新载入整个页面的需求可以交给AJAX来执行。
AJAX包含的技术
AJAX:(Asynchronous JavaScript and XML)并不是一项新技术,其实是多种技术的综合，包括Javascript、XHTML和CSS、DOM、XML和XMLHttpRequest.
服务器端语言：服务器需要具备向浏览器发送特定信息的能力。Ajax与服务器端语言无关。
XML (eXtensible Markup Language，可扩展标记语言) 是一种描述数据的格式。AJAX 程序需要某种格式化的格式来在服务器和客户端之间传递信息，XML 是其中的一种选择
XHTML（eXtended Hypertext MarkupLanguage,使用扩展超媒体标记语言）和 CSS（Cascading Style Sheet,级联样式单）标准化呈现；
DOM（Document Object Model,文档对象模型）实现动态显示和交互；
使用XMLHTTP组件XMLHttpRequest对象进行异步数据读取
使用JavaScript绑定和处理所有数据
Json 格式
前端的运行机制
一个网页从开始请求到最终显示的完整过程
1。在浏览器输入网址
2 发送到DNs服务器获得域名并且得到web服务器的IP地址
3 与web服务器建立tcp连接
4 浏览器向web服务器的ip地址发送相应http请求
5 web 服务器相应请求返回指定uRl 请求
6 浏览器下载后解析html源文件，解析过程中排版 实现页面
----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
以上就是我的bs之旅的一些感受和知识的收获，希望在之后不断实践的积累，然后越来越熟练。