第1章 HTML 5入门
1.1 认识HTML
1.2 HTML 5的新特性
1.3 HTML 5与HTML4的区别
1.3.1 HTML 5的语法变化
1.3.2 HTML 5中的标记方法
1.3.3 HTML 5语法中的3个要点
1.4 新增的主体结构元素
1.4.1 article元素
1.4.2 section元素
1.4.3 nav元素
1.4.4 aside元素
1.5 新增的非主体结构元素
1.5.1 header元素
1.5.2 hgroup元素
1.5.3 footer元素
1.5.4 address元素
1.6 本章小结
第2章 用HTML设置文字与段落格式
2.1 HTML页面主体常用设置
2.1.1 定义网页背景色：bgcolor
2.1.2 设置背景图片：background
2.1.3 设置文字颜色：text
2.1.4 设置链接文字属性
2.1.5 设置页面边距
2.2 页面头部元素和
2.3 页面标题元素
<br/> 2.4 插入其他标记<br/> 2.4.1 输入空格符号<br/> 2.4.2 输入特殊符号<br/> 2.5 设置文字的格式<br/> 2.5.1 字体：face<br/> 2.5.2 字号：size<br/> 2.5.3 文字颜色：color<br/> 2.5.4 粗体、斜体、下画线：b、strong、i、em、cite、u<br/> 2.5.5 上标与下标：sup、sub<br/> 2.5.6 多种标题样式：<h1>～<h6><br/> 2.6 设置段落的排版与换行<br/> 2.6.1 为文字分段<br/> 2.6.2 段落的对齐属性：align<br/> 2.6.3 不换行标记：nobr<br/> 2.6.4 换行标记：br<br/> 2.7 水平线标记<br/> 2.7.1 插入水平线：hr<br/> 2.7.2 水平线的宽度与高度：width、size<br/> 2.7.3 水平线的颜色：color<br/> 2.7.4 水平线的对齐方式：align<br/> 2.7.5 去掉水平线阴影：noshade<br/> 2.8 综合实例—设置页面文本及段落<br/> 2.9 本章小结<br/>第3章 用HTML创建精彩的图像和多媒体页面<br/> 3.1 网页中常见的图像格式<br/> 3.2 插入图像并设置图像属性<br/> 3.2.1 图像标记：img<br/> 3.2.2 图像高度：height<br/> 3.2.3 图像宽度：width<br/> 3.2.4 图像的边框：border<br/> 3.2.5 图像水平间距：hspace<br/> 3.2.6 图像垂直间距：vspace<br/> 3.2.7 图像相对于文字的对齐方式：align<br/> 3.2.8 图像的替代文字：alt<br/> 3.3 音频和视频<br/> 3.3.1 使用embed<br/> 3.3.2 使用video<br/> 3.4 综合实例—创建多媒体网页<br/> 3.5 本章小结<br/>第4章 用HTML创建超链接<br/> 4.1 超链接和路径<br/> 4.1.1 超链接的概念<br/> 4.1.2 路径URL<br/> 4.1.3 HTTP路径<br/> 4.1.4 FTP路径<br/> 4.1.5 邮件路径<br/> 4.2 链接元素<a<br/> 4.2.1 指定路径属性href<br/> 4.2.2 显示链接目标属性target<br/> 4.2.3 链接的热键属性accesskey<br/> 4.3 创建图像的超链接<br/> 4.3.1 创建链接区域元素<map><br/> 4.3.2 链接区域的名称属性name<br/> 4.3.3 定义鼠标敏感区元素<area><br/> 4.3.4 链接的路径属性href、nohref<br/> 4.3.5 鼠标敏感区坐标属性coords<br/> 4.4 创建锚点链接<br/> 4.5 综合实例—为网页添加链接<br/> 4.6 本章小结<br/>第5章 使用HTML创建表格<br/> 5.1 创建并设置表格属性<br/> 5.1.1 表格的基本标记：table、tr、td<br/> 5.1.2 表格宽度和高度：width、height<br/> 5.1.3 表格的标题：caption<br/> 5.1.4 表格的表头：th<br/> 5.1.5 表格对齐方式：align<br/> 5.1.6 表格的边框宽度：border<br/> 5.1.7 表格的边框颜色：bordercolor<br/> 5.1.8 单元格间距：cellspacing<br/> 5.1.9 单元格边距：cellpadding<br/> 5.1.10 表格的背景色：bgcolor<br/> 5.1.11 表格的背景图像：background<br/> 5.2 表格的结构标记<br/> 5.2.1 设计表头样式：thead<br/> 5.2.2 设计表主体样式：tbody<br/> 5.2.3 设计表尾样式：tfoot<br/> 5.3 综合实例—使用表格排版网页<br/> 5.4 本章小结<br/>第6章 创建交互式表单<br/> 6.1 表单元素<form<br/> 6.1.1 动作属性action<br/> 6.1.2 发送数据方式属性method<br/> 6.1.3 名称属性name<br/> 6.2 表单对象<input<br/> 6.2.1 文本域text<br/> 6.2.2 密码域password<br/> 6.2.3 提交按钮submit<br/> 6.2.4 复位按钮reset<br/> 6.2.5 图像域image<br/> 6.2.6 普通按钮button<br/> 6.2.7 复选框checkbox<br/> 6.2.8 单选按钮radio<br/> 6.2.9 隐藏域hidden<br/> 6.3 综合实例—用户注册表单页面<br/> 6.4 本章小结<br/>第7章 HTML 5绘图Canvas和SVG<br/> 7.1 Canvas绘制基本图形<br/> 7.1.1 Canvas元素<br/> 7.1.2 绘制直线<br/> 7.1.3 绘制矩形<br/> 7.1.4 绘制三角形<br/> 7.1.5 绘制圆弧<br/> 7.1.6 绘制贝塞尔曲线<br/> 7.2 颜色和样式选项<br/> 7.2.1 应用不同的线型<br/> 7.2.2 绘制线性渐变<br/> 7.2.3 绘制径向渐变<br/> 7.3 变换<br/> 7.3.1 平移变换<br/> 7.3.2 缩放变换<br/> 7.3.3 旋转变换<br/> 7.4 SVG<br/> 7.4.1 图形绘制<br/> 7.4.2 文本与图像<br/> 7.4.3 笔画与填充<br/> 7.5 综合实例—绘制精美时钟<br/> 7.6 本章小结<br/>第8章 CSS基</div>
<div class="showMore"><i class="bShowIcon"></i><span class="showText">展开</span></div>
</div>
</div>
</div>
</div>
</div>
<!--加入我的书架成功弹框-->
<div class="joinArea">
<div class="cgPopupMask"></div>
<div class="joinCon">
<img src="/tcshop/resource/front-resource/images/info07.png" alt="" />
<div class="joinText">
加入书架成功！
</div>
<div class="fn-clear">
<a class="goOnBuy fn-left" href="javascript:;" onclick="continueSee()">继续借书</a>
<a class="goAccount fn-left" href="/tcshop/1111/cart/cart.html">去结算</a>
</div>
</div>
</div>
<!--收藏图书弹框-->
<div class="delColArea">
<div class="cgPopupMask"></div>
<div class="colCon">
<div class="cgPopupConTop">
<div class="hisPopTit">
收藏图书成功！
</div>
<div class="iKnow">
我知道了(<span class="iKnowTime">3</span>)
</div>
</div>
</div>
</div>
<!-- 评论弹窗 -->
<div class="delColArea" id="comment_view">
<div class="cgPopupMask"></div>
<div class="commont_div">
<div style="margin-top:10px;margin-bottom:10px;margin-left:-10px;">
发表书评
</div>
<div style="border:2px solid #DDD; padding: 5px;" >
<textarea style="width:100%;height:150px;resize:none;" id="comment">
</textarea>
</div>
<div style="text-align:right;margin-top:5px;">
<button onclick="hideComment()" style="padding:4px;background:#888888;color:#FFFFFF;margin-right:10px;border-radius:2px;cursor:pointer">
取消
</button>
<button onclick="sendComment()" style="padding:4px;background:#dc281c;color:#FFFFFF;border-radius:2px;cursor:pointer">
发表
</button>
</div>
</div>
</div>
<!--登录弹框-->
<div class="cgPopupArea" id="loginArea">
<div class="cgPopupMask"></div>
<div class="cgPopupCon">
<div class="cgPopupConTop">
<i class="cloLogin cloPop"></i>
<div class="readLogin">读者登录</div>
<!--手机注册的图书馆code字符串 例如：1039,1096-->
<p class="warmPrompt">
请选择您读者所在的图书馆
</p>
<div class="loginWrap">
<div class="loginRoom loginSel fn-clear">
<div class="loginIcon loginRoomIcon fn-left">
</div>
<font class="roomName fn-left" id="pLib">选择图书馆</font>
<select id="unitLibCode" class="selDown " onChange="changeLib(this)">
<option selected="selected" value="lib_zjlib">省本级</option>
<option value="lib_330400000">嘉兴市</option>
<option value="lib_330500000">湖州市</option>
<option value="lib_330700000">金华市</option>
<option value="lib_331100000">丽水市</option>
<option value="lib_331000000">台州市</option>
<option value="lib_zslib">舟山市</option>
<option value="lib_qzlib">衢州市</option>
<option value="lib_wzlib">温州市</option>
<option value="lib_hzlib">杭州市</option>
<option value="lib_nblib">宁波市</option>
<option value="lib_sxlib">绍兴市</option>
</select>
<div class="flag03">
</div>
</div>
<div class="loginError">
</div>
</div>
<div class="loginWrap" id="cUnionWrap" >
<div class="loginRoom loginSel fn-clear">
<div class="loginIcon loginRoomIcon fn-left">
</div>
<font class="roomName fn-left" id="cLib">浙江图书馆</font>
<select id="cLibSelect" class="selDown" onChange="changeCLib()">
<option value="330000000,zjlib">浙江图书馆</option>
</select>
<div class="flag03">
</div>
</div>
<div class="loginError">
</div>
</div>
<div class="loginWrap">
<div class="loginSel fn-clear">
<div class="loginIcon loginHead fn-left">
</div>
<input class="userID fn-left" type="text" name="username"
id="username" value="" placeholder="请输入身份证号" onblur="accCheck('acc')"/>
</div>
<div class="loginError" id="accMsg">
</div>
</div>
<div class="loginWrap">
<div class="loginSel fn-clear">
<div class="loginIcon loginPass fn-left ">
</div>
<input class="userPass fn-left " type="password" name="password"
id="password" value="" placeholder="请输入读者密码" onblur="accCheck('pwd')"/>
</div>
<div class="loginError" id="pwdMsg">
</div>
</div>
<div class="loginWrap">
<div class="fn-clear">
<div class="loginSel loginCode fn-left codeWrap">
<div class="loginIcon loginCode fn-left ">
</div>
<input class="codeInput fn-left" type="text" name="vcode" id="vcode" value="" placeholder="验证码" />
</div>
<div class="codeImg fn-left">
<img src="/tcshop/ValidateImage.do"
id="codeImg"
alt="点击获取验证码"
title="点击获取验证码"
onclick="this.src='/tcshop/ValidateImage.do?t='+new Date().getTime();"/>
</div>
</div>
</div>
<div class="clickLogin" id='readerLogin'>
登录
</div>
<div style="float:right">
没有读者证？<a href="/tcshop/1111/help/168.html" style="color: #175199;">在线办证</a>
</div>
</div>
</div>
</div>
<style>
.commont_div {
width: 350px;
height: 250px;
margin-left: -185px;
padding: 0 30px;
background: #fff;
position: fixed;
left: 50%;
top: 35%;
z-index: 3;
border-radius: 5px;
font-size: 16px;
}
</style>
<script type="text/javascript">
$(function(){
loadBookcovers();
loadBookInfo("TC_TEST_OPCS",'9787302589204','1111');
})
//init the value
var seller="XHSD";
var isbn="9787302589204";
var isOverHoldingCount="0";
var isNotUnitCatalog="0";
var status="2";
var productId="18463696";
var incart="";
var opacUrl="";
var orglib="330000000";
var jdcatalog2="";
var jdcatalog3="";
var seller="XHSD";
var jdSkuId="2ONTUTc5MQ==";
var stock = "-1";
var pUnit = "";
var packnum = "0";
var libsellerTag="false";
var bookloginType="0";
var libunion="1";
var unitcode = "1111";
$(function(){
console.log(unitcode);
if(unitcode == "1212" || unitcode == "1039"){
$("#comment").val("");
loadComment();
}
});
// 加载 用户评论
function loadComment(){
$.ajax({
url: "/tcshop/1111/comment/findBookComment?productID="+productId,
data: {offset: 0, pageSize: 10},
success: function(res){
console.log(">>>>>>>获取的评论res");
console.log(res);
// 是否获取成功
if(res.result == "false"){
$("#comment_content").append("<div style='text-align:center;'>暂时没有评论哦~！</div>");
return ;
}
// 评论内容 list
var commentList = res.data.list;
if(commentList.length == 0){
$("#comment_content").append("<div style='text-align:center;'>暂时没有评论哦！</div>");
return ;
}
// 遍历
var c_div = "";
var nickname = ""; // 昵称
var date = ""; // 日期
for(var i = 0 ; i < commentList.length ; i++){
// 昵称 部分隐藏
nickname = commentList[i].nickname;
if(nickname == null || nickname == ""){
nickname = "默**";
}else{
nickname = nickname.substr(0,1)+"**";
}
date = commentList[i].createdate.split(" ")[0];
c_div = '<div style="margin-bottom:8px;"><div style="color: #AAA;">';
c_div += '<span style="margin-right:2px;">'+nickname+'</span>';
c_div += '<span style="font-size: 12px;">'+date+'</span></div>';
c_div += '<div style="padding-left:15px;">'+commentList[i].content+'</div></div>';
$("#comment_content").append(c_div);
}
},
error: function(err){
console.error(err);
$("#comment_content").append("<div style='text-align:center;'>暂时没有评论哦!!!</div>");
return ;
}
});
}
// 显示发表书评
function showComment(){
// 未登录，显示 登录框
dialogMsg("请您先登录！")
showLoginView();
}
// 隐藏发表书评
function hideComment(){
$("#comment_view").hide(500);
}
// 发表书评
function sendComment(){
var content = $("#comment").val()+"";
content = content.replace(/(^\s*)|(\s*$)/g, "");
if(content == ""){
dialogMsg("内容不能为空哦 ！");
return;
}
loading("提交中...")
$.ajax({
url: "/tcshop/1111/comment/releaseComment",
data: {productID: productId, content: content, status: 'n'},
success: function(res){
console.log(">>>>>>>发表的评论结果res");
console.log(res);
closeLoading();
// 显示消息
dialogMsg(res.msg);
// 是否获取成功
if(res.result == "false"){
if(res.msg.indexOf("请先登录") != -1){
showLoginView();
hideComment();
}
return ;
}
dialogMsg("提交成功！");
$("#comment").val("");
hideComment();
},
error: function(err){
closeLoading();
console.error(err);
dialogMsg("评论失败哦！！！");
return ;
}
});
}
</script>
<!--放大镜-->
<script src="/tcshop/resource/front-resource/js/jquery.jqzoom.js"></script>
<script src="/tcshop/resource/front-resource/js/jquery-labelauty.js"></script>
<script src="/tcshop/resource/front-resource/js/lanrenzhijia.js"></script>
<script type="text/javascript" src="/tcshop/resource/js/UnionLib.js?version=20220601"></script>
<script src="/tcshop/resource/front-resource/js/acc.js?version=20220601"></script>
<script src="/tcshop/resource/front-resource/js/product.js?version=20220601"></script>
<div class="footWrap">
<div class="linkWrap">
<div class="linkContent">
<!--修改start-->
<div class="fn-clear">
<ul class="linkList fn-left">
<li class="linkTit">新手上路</li>
<li>
<a href="/tcshop/1111/help/54.html" target="_blank">
快速入门
</a>
</li>
</ul>
<ul class="linkList fn-left">
<li class="linkTit">购物指南</li>
<li>
<a href="/tcshop/1111/help/72.html" target="_blank">
常见问题
</a>
</li>
</ul>
<ul class="linkList fn-left">
<li class="linkTit">支付方式</li>
<li>
<a href="/tcshop/1111/help/56.html" target="_blank">
支付方式
</a>
</li>
</ul>
<ul class="linkList fn-left">
<li class="linkTit">配送方式</li>
<li>
<a href="/tcshop/1111/help/73.html" target="_blank">
快递送货
</a>
</li>
</ul>
<ul class="linkList fn-left">
<li class="linkTit">关于我们</li>
<li>
<a href="/tcshop/1111/help/58.html" target="_blank">
关于我们
</a>
</li>
</ul>
<ul class="linkList fn-left">
<li class="linkTit">特色服务</li>
<li>
<a href="/tcshop/1111/help/81.html" target="_blank">
在线办证
</a>
</li>
</ul>
</div>
<!--修改end-->
</div>
</div>
<!--页尾-->
<div class="footer">
©广州图创计算机软件开发有限公司
</div>
</div>
</body>
</html>
