>웹 프론트엔드 >H5 튜토리얼 >HTML5의 Web SQL 학습 요약

HTML5의 Web SQL 학습 요약

青灯夜游
青灯夜游앞으로
2018-11-13 09:35:233263검색

이 글의 내용은 HTML5의 Web Sql 학습 요약을 소개하여 Web Sql 관련 지식을 어느 정도 이해할 수 있도록 하는 것입니다. 도움이 필요한 친구들이 참고할 수 있기를 바랍니다.

웹 시스템이나 애플리케이션에서는 일부 데이터를 로컬에 저장해야 하는 경우가 많습니다. 클라이언트에 데이터를 저장하는 가장 빠른 방법은 쿠키였습니다(물론 쿠키는 주로 사용자의 상태를 저장하는 데 사용됩니다. 로컬 데이터를 저장할 수 있습니다. 라이브) 실제로는 클라이언트의 로컬 데이터를 저장하는 데 적합하지 않습니다.

1 서버를 요청할 때마다 불필요한 트래픽 소비가 증가합니다. 서버에 요청하면 서버와 대화합니다. 쿠키가 서버로 전송됩니다.

2. 쿠키 데이터에 데이터를 저장하는 규칙은 사용하기 쉽지 않으며 구조도 충분히 명확하지 않습니다.

3. 가장 중요한 점은 쿠키의 저장 용량이 매우 작다는 것입니다. 각 쿠키의 길이는 4kb를 초과할 수 없으며, 가장 먼저 저장된 쿠키 데이터가 잘리므로 이는 분명히 충분하지 않습니다.

HTML5의 개발과 함께 localStorage와 sessionStorage가 나중에 등장했습니다:

localStorage: 페이지를 다시 입력하는 데 시간이 걸리거나 페이지가 있는 사이트에 관계없이 영구 저장소(clearI를 사용하여 삭제할 수 있음) 또는 RemoveItem 메소드) 저장된 데이터를 얻을 수 있습니다.

sessionStorage: 임시 저장 공간으로 페이지를 닫으면 저장된 데이터가 자동으로 지워집니다.

실제로 자신의 프로젝트를 작업하거나 개발할 때 이 두 개체가 가장 많이 사용됩니다. 적어도 현재 이 두 개체는 여전히 대부분의 프로젝트의 로컬 저장소 요구 사항을 충족할 수 있습니다. 로컬 저장소 데이터가 여전히 너무 단순합니다.

주로 요약하자면,

HTML5의 새로운 API->Web Sql 로컬 데이터베이스 기술, Web Sql 데이터베이스 API는 실제로 HTML5 사양의 구성 요소가 아니라 독립적인 사양이며 사용할 수 있습니다. SQL 언어의 기본적으로 일관된 구문을 사용하면 로컬 데이터베이스의 추가, 삭제, 수정 및 검색이 가능하므로 백엔드 개발 경험이 있는 개발자도 쉽게 시작할 수 있습니다. (HTML5가 Web Sql 데이터베이스 데이터베이스를 포기했다는 점을 지적해야 합니다. 및 본 사양의 사양 작업이 중단되었습니다.) 그럼에도 불구하고 대부분의 브라우저에서 기본적으로 지원됩니다. 이제 그 사용법을 소개하겠습니다.

WebSql 데이터베이스 만들기:

openDatabase(数据库名,数据库版本号,描述,数据库大小,数据库创建成功的回调);
var mydb = openDatabase('myTeatDatabase',1,'this a Web Sql Database',1024*1024,function(){
     //数据库创建成功的回调,可省略
});

참고: 이 메서드는 생성된 데이터베이스가 이미 존재하는 경우 데이터베이스를 직접 엽니다.

트랜잭션 생성:

mydb.transaction(function(tx){
    //该方法有一个事务对象参数供使用,该对象上有一系列为数据库增删改查的方法。
});

작업 수행:

tx.executeSql(执行数据库操作的sql语句,参数,数据库操作执行成功的回调,数据库操作执行失败的回调);

특정 데이터베이스 작업:

데이터 테이블 생성:

tx.executeSql('create table if not exists table1 (id unique,name)', [], function(tx, result) { 
	//成功回调
	},function(error){
         //失败回调
	});

참고: 이 진술은 다음을 의미합니다. table1 데이터 테이블을 생성합니다. 이 테이블이 데이터베이스에 존재하지 않는 경우 "존재하지 않는 경우"가 문에 추가되지 않으면 생성하려는 데이터 테이블이 데이터베이스에 이미 존재하는 경우 오류가 보고됩니다.

데이터 테이블 삭제:

tx.exexcteSql('drop table table1',[],function(tx,result){
      //删除成功时的回调
      },function(error){ 
         //删除失败时的回调
      });

데이터 테이블에 데이터 추가:

tx.executeSql('insert into table1 (id,name) values (1,'小明')',[],function(tx,result){
            //添加数据成功时的回调
            },function(error){
                  //添加数据失败时的回调
            });

데이터 테이블에서 하나 이상의 데이터 삭제:

tx.executeSql('delete from table1 where id=1',[],function(tx,result){
//删除成功时的回调
},function(error){
    //删除失败时的回调
});

또는:

tx.executeSql('delete from table1 where id=?',[1],function(tx,result){
//删除成功时的回调
},function(error){
    //删除失败时的回调
});

Update 데이터베이스 테이블의 데이터 조각:    

tx.executeSql('updata table1 set name="小红" where id=1',[],function(tx,result){
   //数据更新成功时的回调
   },function(error){
       //数据更新失败时的回调
   });

쿼리 조건을 충족하는 데이터 쿼리:  

tx.executeSql('select * from table',[],function(tx,result){
//查询成功时的回调
},function(error){
  //查询失败时的回调
});

참고: 쿼리가 성공하면 쿼리에서 반환된 데이터를 행을 통해 사용할 수 있습니다. 콜백 함수의 결과 매개변수 속성입니다.

이 예제는 가장 간단한 쿼리 문일 뿐입니다. 더 복잡한 쿼리가 필요한 경우 sql 문을 참조하세요.

요약:

사실 이 데이터베이스 API는 비교적 간단합니다. 모든 추가, 삭제, 수정 및 쿼리는 트랜잭션을 생성하고 트랜잭션 개체에 대한 모든 작업을 수행해야 합니다. 전체 데이터베이스 삭제를 지원하지 않지만 유사한 효과를 얻기 위해 해당 데이터베이스의 모든 데이터 테이블을 삭제하여 데이터베이스를 지울 수 있습니다.

위 내용은 HTML5의 Web SQL 학습 요약의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
이 기사는 cnblogs.com에서 복제됩니다. 침해가 있는 경우 admin@php.cn으로 문의하시기 바랍니다. 삭제