>  기사  >  웹 프론트엔드  >  uniapp과 HTML의 차이점은 무엇입니까

uniapp과 HTML의 차이점은 무엇입니까

青灯夜游
青灯夜游원래의
2021-02-24 17:08:002784검색

차이점: 1. uniapp은 프레임워크인 반면 HTML은 마크업 언어입니다. 2. 구성요소/레이블에는 차이가 있습니다. 예를 들어 p는 보기로 변경되고, 범위 및 글꼴은 텍스트로 변경되고, a는 탐색기로 변경되고, img는 이미지로 변경됩니다. 3. Uniapp은 DOM 작업을 지원하지 않지만 HTML은 지원합니다.

uniapp과 HTML의 차이점은 무엇입니까

이 튜토리얼의 운영 환경: windows7 시스템, uni-app2.5.1&&HTML5 버전, thinkpad t480 컴퓨터.

유니앱과 HTML의 차이점

컴포넌트/라벨 변경

예전에는 HTML 태그였는데 이제는 미니 프로그램 태그입니다

  • p가 보기로 변경되었습니다
  • span, 글꼴이 텍스트로 변경됨
  • a 네비게이터로 변경됨
  • img가 이미지로 변경됨
  • 입력은 그대로 유지되지만 유형 속성이 확인유형
  • 으로 변경됨form, 버튼, 체크박스, 라디오, 라벨, 텍스트 영역, 캔버스, 비디오, 이것들은 아직 거기에 있습니다.
  • select가 picker로 변경됨
  • iframe이 web-view로 변경됨
  • ul 및 li가 사라지고 view
  • audio가 더 이상 권장되지 않음, api 모드로 변경됨, 백그라운드 오디오 api 문서
    실제로 이전 HTML 태그 uni-app 컴파일러는 컴파일 중에 이전 태그를 새 태그로 변환합니다. 그러나 이 사용법은 H5 측을 디버깅할 때 혼동되기 쉽고 요소 기반 선택기에서도 문제가 발생합니다.

추천: "uni-app 개발 튜토리얼"

변경 사항 외에도 휴대폰에서 일반적으로 사용되는 여러 가지 새로운 구성 요소가 추가되었습니다

  • scroll-view 지역 스크롤 뷰 컨테이너

  • 스와이프 슬라이딩 영역 보기 컨테이너

  • 아이콘 아이콘

  • 리치 텍스트 리치 텍스트(js를 실행할 수 없지만 다양한 텍스트 형식과 이미지를 렌더링할 수 있음)

  • 진행률 진행률 표시줄

  • 슬라이더 슬라이더 표시 장치 ㅋㅋㅋ 몇 가지만 강조하자면, uni-app의 h5가 아닌 쪽의 비디오, 지도, 캔버스 및 텍스트 영역은 기본 구성 요소이며 다른 구성 요소보다 높은 수준입니다. 지도에 마스크를 추가하는 등 기본 구성 요소를 덮어야 하는 경우 Cover-view 구성 요소를 사용해야 합니다

  • 내장 구성 요소 외에도 일반적인 작업을 캡슐화하는 오픈 소스 확장 구성 요소가 많이 있습니다. DCloud는 플러그인 마켓을 구축했습니다. 이러한 확장 구성 요소를 포함하려면 자세한 내용은 플러그인 마켓을 참조하세요

  • js 변경 사항

  • 실행 환경이 브라우저에서 v8 엔진으로 변경되었습니다

  • Standard if, for, settimeout, indexOf 등 js 구문과 API가 지원됩니다.

    단, 브라우저별 창, 문서, 탐색기, 위치 개체는 브라우저에서만 사용할 수 있으며 앱 및 애플릿에서는 지원되지 않습니다. . 이는 jqurey와 같이 문서에 의존하는 많은 HTML 라이브러리를 사용할 수 없음을 의미합니다. 그러나 앱과 작은 프로그램은 표준 HTML을 로드할 수 있는 웹 보기 구성 요소를 지원합니다. 이러한 종류의 페이지는 여전히 브라우저별 개체 창, 문서, 탐색기, 위치를 지원합니다
  • 이전 DOM 작업이 Vue의 MVVM 모드로 변경되었습니다

    경고, 확인이 uni.showmodel로 변경되었습니다
ajax가 uni.request

cookie로 변경되고 세션이 사라지고 local.storage가 uni.storage

uni-app에 js api가 많이 있지만 기본적으로 작은 프로그램 API이므로 wx.xxx를 uni.xxx로 변경하세요css 변경

선택기에 2가지 변경 사항이 있습니다. *선택기는 요소 선택기에 본문이 지원되지 않습니다. 페이지로 변경되었습니다
  • 단위 측면에서 px는 다양한 너비의 화면에 동적으로 적응할 수 없으며, rem은 h5에만 사용할 수 있고, rpx는 WeChat mini 프로그램에만 사용할 수 있습니다. 이를 위해 uni-app에서는 모든 단말기와 모든 화면 너비에 적용되는 동적 단위인 upx를 추가했습니다. upx
  • uni-app에서는 flex 레이아웃 사용을 권장하며 기본값은 flex 레이아웃입니다

더 많은 프로그래밍 관련 지식을 원하시면, 방문해주세요:

프로그래밍 비디오
    ! !

위 내용은 uniapp과 HTML의 차이점은 무엇입니까의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.