9.停下來講說jquery

時間 2019-12-01

標籤停下來講 jquery 欄目 JQuery 简体版

原文原文鏈接

#1. javacript時代到jquery時代不一樣瀏覽器對javacript解析的差別性，致使作兼容處理的成本的上升，聰明人很快發現了這個痛點，因而，抹平瀏覽器差別的jQuery庫出現了。html

jQuery：用更少的代碼，實現更強悍的功能java

jQuery由一小撮對瀏覽器極其熟稔的極客負責抹平不一樣瀏覽器的差別，其餘開發者只須要基於jQuery進行開發，能夠更好地關注業務實現，而不是把時間花在適配不一樣的瀏覽器上。jquery

jQuery解決一個瀏覽器兼容性問題瀏覽器

#2. 滿眼的全是DOM jQuery使得開發無刷新動態頁面（AJAX）或者單頁應用（SPA）變得至關簡單。函數

標準的HTML頁面是靜態的，被瀏覽器渲染後就產生了一個DOM樹 code

jQuery讓靜態的文檔動起來，經過提供一系列的選擇符，jQuery使開發者可以極其方便地選中一組DOM節點，對其進行操做。htm

這就是jQuery的開發範式。jQuery沒有引入什麼新的概念，只是樸素地，讓你可以更簡單地、低成本地操做DOM：對象

用選擇符選定一組DOM節點
操做選中的DOM節點，好比：修改文本、改變屬性、掛接事件監聽函數、變換DOM等等。
基本不用考慮跨瀏覽器的兼容性

#3. jquery的一個簡單實例用jQuery實現一個小時鐘咱們試着用jQuery實現一個簡單的時鐘頁面，實現思路很簡單：事件

引入jquery庫 jquery庫將建立一個全局對象：$。開發者須要的API都掛接在這個對象上。它實際上是一個類工廠，負責將指定的DOM對象轉化爲jquery對象。圖片
在DOM文檔就緒後，啓動一個定時器使用$(document).ready()能夠監聽DOM文檔就緒事件，一般簡寫成$(...)。
在定時器裏更新div#clock的文本 "div#clock"是一個選擇符，使用這個選擇符，jquery庫能夠找到那個特定的DOM對象，並將其轉化爲jQuery對象。
jquery封裝後的DOM對象有一堆的方法供你調用，咱們使用text()方法更新其文本

<html>
<head>
	<!--引入jquery庫，這將建立一個全局的對象：$ -->
	<script src="http://libs.baidu.com/jquery/1.11.1/jquery.min.js"></script>
</head>
<body>
	<!--div#clock做爲咱們的時鐘模板，將被定時刷新-->
	<div id="clock"></div>
</body>
</html>


//監聽DOM就緒事件
$(function(){
	//啓動定時器
	setInterval(function(){
		//取當前時間
		var d = new Date();

		//使用text()方法更新DOM對象的文本內容
		$("#clock").text(d.toString());

	},1000/*1000毫秒觸發1次*/);
});

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。