1、localStorage 没有 时间的限制数据存储, sessionStorage 针对一个session的存储,首先检查浏览器是否支持对这两个的存储,

ifI(type(Storage)!=="undefined"){

// 支持}else{

不支持}

localStorage对数据存储没有时间的限制,eg、

<div id="result"></div>

<script> ifI(typeof(Storage)!=="undefined"){

lLocalStorage.sitename="菜鸟";

document.getElementById("result").innerHTML=“网站名”+"localStorage.setname;}

else{

document.getElementById("result").innerHTML="浏览器不支持"}</script>

2、计算 <div id="reult"></div>

<script> function clickCount(){

if(typeof(Storage)1=="undefined”){

if(localStorage.clickcount){

localStorage.clickcount=Number(localStorage.clickcount)+1;

}else{

localStorage.clickcount=1;}

document.getElementById("result").innerHTML="localStorage.localcount;

}else{

doucment.getElement.ById(“result”).innerHtml="比支持"}

}</script>

3、web SQL操作

openDatabase 使用数据库  transaction 控制数据库   execute Sql    数据库查询

打开数据库     var  db=openDatabase("mydb", '1.0', 'test DB',2*1024*1024)分别是数据库名称, 版本号  描述文本  数据库大小

db.transaction(function(tx){ tx.executeSql('CREATE Table if  not exists LoGS (id unique,log)');});

删除数据记录  db.transaction(function(tx){

tx.excuteSql('delete from logs where id=1')})

更新数据   db.transaction(function(tx){

tx.excuteSql('Update logs set log=\'www.w3cschool\' where id=2');})

4、启用应用程序缓存  <!DOCTYPE HTML>

<html manifest="demo.appcache">   </html>

5、接收 Servert -sent事件通知

var source=new EventSource("demo-sse.php");

source.onmessage=function(event){

doucnemt.getElementById("result").innerHTML++evnt.data+"<br>";}

检测server-Sent事件支持    if(type(EventSource)!=="undefined"){

//浏览器支持}else{

//浏览器不支持  Server-sent}

6、WebSocket是HTML5单个TCP链接上的全双工通讯协议, WebSocketAPI中。浏览器和服务器只需要做一次握手工作,然后浏览器和服务器之间就形成一条快速通道,两者之间就直接可以同数据, 介质是 JavaScript像服务器发送建立WebSocket的链接请求,当获取WEbSocket 链接之后 通过send()方法像服务器发送数据。并通过onmessage事件来接受服务器返回的数据。

一、Html部分

HTML基础:

1、HTML标题(heading)t通过<h1><h6>标签定义,

eg:<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>SueKay</title>
<body>
<h1>it's my sister </h1>
<p>it's your sister</p.html
>
</body>
</html>

2、段落标<p>,</p>  ,<hr >这个标签用于对段落的分割,段落顺序倒着写<p><bdo dir="rtl">这段文字倒着显示</bdo></p>

删除效果<p>My favorite color is <del>blue</del>  <ins>red</ins></p>

<! DOCTYPE html >

<html>

<head>it's my notebook</head>

<body><p>it's  your dog </p>

<p>it's second <br> paragraph</p><body>

</html>

另外HTML的注释,<!--it's   notesiad-->,插入段落之间的水平线使用标签<hr/>,在一个段落中实现回行,直接键入标签<br>

3、HTML链接<a href="http://www.baidu.com">it's a link</a>

4、HTML图像链接 <img src=“img/log/png ” width=“23” height=“23”>

5、文本格式化:对<body>中的字体进行设置<b> 粗体 <i>斜体显示。<sub></sub>下标 <sup></sup>上标,

<pre></pre>标签的使用保留原来文本的输入样式

<code></code>计算机输出标签样式,<var></var >计算机变量。

<address> written by <a href="maitl:webster@example">Jon Doe</a></address>

HTML&javaSkcript&CSS&jQuery&ajax(11)的更多相关文章

  1. HTML&javaSkcript&CSS&jQuery&ajax(五)

    一.Framset标签定义了每个框架中的HTML文档, 1. <framset cols="25%,75%"> <frame src="frame_a. ...

  2. HTML&javaSkcript&CSS&jQuery&ajax(十)

    HTML 1.SVG直接嵌入HTML网页 ,SVG 是使用XML描述2D图像的语言,Canvas通过JavaScript来绘制2D <svg xmlns="http://www.w3. ...

  3. HTML&javaSkcript&CSS&jQuery&ajax(九)

    一.HTML 1.单选按钮 <form action="><inpput type="radio" name="sex" value ...

  4. HTML&javaSkcript&CSS&jQuery&ajax(六)

    一.HTML表单 1.<input type="text">定义文本输入的单上输入字段,<form> First name:<br>   < ...

  5. HTML&javaSkcript&CSS&jQuery&ajax(二)

    一.HTML 1.标签<a href="http:www.baidu.com">This is a link </a>         <img sr ...

  6. HTML&javaSkcript&CSS&jQuery&ajax(八)

    一. <!DOCTYPE html><html><head><meta charset="utf-8"><tiitle> ...

  7. HTML&javaSkcript&CSS&jQuery&ajax(七)

    ’一.HTML5 实例  <video width="430" controls>   <source src="mov_nnn.mp4" t ...

  8. HTML&javaSkcript&CSS&jQuery&ajax(四)

    一.HTML创建响应设计 Responsive Web Design 可以改变尺寸传递网页,对于平板和移动设备是必须的 1.<!DOCTYPE html><html lang=&qu ...

  9. HTML&javaSkcript&CSS&jQuery&ajax(三)

    一.HTML块元素 1.块级元素 Block level element ,内联元素 inline element , HTML<div>元素属于块级元素,他是组合其他HTML元素的容器, ...

随机推荐

  1. 浏览器支持webp格式

    使用插件http://www.etherdream.com/WebP/WebP.js

  2. 库zlog的使用手册

    库官方网址: 使用手册:    http://hardysimpson.github.io/zlog/UsersGuide-CN.html#htoc11 [formats] simple = &quo ...

  3. 【Java编程思想笔记】-集合1

    1.为什么要用集合? 一般情况下,数组是保存一组对象(或基本数据类型)最有效的方式.但是数组有着固定的尺寸,而在更一般的情况下,我们在写程序时不知道将需要保存多少个对象,或者是否需要更复杂的存储结构来 ...

  4. POI 海量数据/大数据文件生成SXSSFWorkbook使用简介

    在之前我们知道处理xls的excel用的workbook是HSSFWorkbook,处理xlsx的excel用的是XSSFWorkbook. 上面两个类导出excel的时候数据会驻留在内存中,所以当数 ...

  5. Idea实用配置

    参考:https://github.com/judasn/IntelliJ-IDEA-Tutorial 1.代码提示不区分大小写 2.跳到指定行 Ctrl + G Ctrl 快捷键 介绍 Ctrl + ...

  6. go 单引号,双引号,反引号区别

    go里面双引号是字符串,单引号是字符,不存在单引号字符串. 但有反引号字符串,就是esc键下面1键左边tab键上面那个键,区别是反引号字符串允许换行符

  7. 2018 Multi-University Training Contest 2 杭电多校第二场

    开始逐渐习惯被多校虐orz  菜是原罪 1004  Game    (hdoj 6312) 链接:http://acm.hdu.edu.cn/showproblem.php?pid=6312 虽然披着 ...

  8. 2. Spring Boot项目启动原理初探

    SpringBoot从宏观上说,就是对spring容器进行了一层包装.它内部的入口是利用 SpringApplication类的static的 run 方法进行启动的,调用的图: 上图中的这些方法都位 ...

  9. qunee 开发清新、高效的拓扑图组件 http://www.qunee.com/

    qunee  开发清新.高效的拓扑图组件  http://www.qunee.com/ RoadFlow:  http://www.cqroad.cn/ 村暖花开

  10. Nest + typeorm

    1\     Nest (https://nestjs.com/)  is a framework for building efficient, scalable Node.js web appli ...