整合營銷服務商
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
HTML 使用超級鏈接與網絡上的另一個文檔相連。幾乎可以在所有的網頁中找到鏈接。點擊鏈接可以從一張頁面跳轉到另一張頁面。
HTML 鏈接
如何在HTML文檔中創建鏈接。
(可以在本頁底端找到更多實例)
HTML 超鏈接（鏈接）
HTML使用標簽 <a>來設置超文本鏈接。
超鏈接可以是一個字，一個詞，或者一組詞，也可以是一幅圖像，您可以點擊這些內容來跳轉到新的文檔或者當前文檔中的某個部分。
當您把鼠標指針移動到網頁中的某個鏈接上時，箭頭會變為一只小手。
在標簽<a> 中使用了href屬性來描述鏈接的地址。
默認情況下，鏈接將以以下形式出現在瀏覽器中：
一個未訪問過的鏈接顯示為藍色字體并帶有下劃線。
訪問過的鏈接顯示為紫色并帶有下劃線。
點擊鏈接時，鏈接顯示為紅色并帶有下劃線。
注意：如果為這些超鏈接設置了 CSS 樣式，展示樣式會根據 CSS 的設定而顯示。
HTML 鏈接語法
鏈接的 HTML 代碼很簡單。它類似這樣：:
<a href="url">鏈接文本</a>
href 屬性描述了鏈接的目標。.
實例
<a >訪問菜鳥教程</a>
上面這行代碼顯示為：: 訪問菜鳥教程
點擊這個超鏈接會把用戶帶到菜鳥教程的首頁。
提示: "鏈接文本" 不必一定是文本。圖片或其他 HTML 元素都可以成為鏈接。
HTML 鏈接 - target 屬性
使用 target 屬性，你可以定義被鏈接的文檔在何處顯示。
下面的這行會在新窗口打開文檔：
實例
<a>訪問菜鳥教程!</a>
HTML 鏈接- id 屬性
id屬性可用于創建在一個HTML文檔書簽標記。
提示: 書簽是不以任何特殊的方式顯示，在HTML文檔中是不顯示的，所以對于讀者來說是隱藏的。
實例
在HTML文檔中插入ID:
<a id="tips">有用的提示部分</a>
在HTML文檔中創建一個鏈接到"有用的提示部分(id="tips"）"：
<a href="#tips">訪問有用的提示部分</a>
或者，從另一個頁面創建一個鏈接到"有用的提示部分(id="tips"）"：
<a >
訪問有用的提示部分</a>
基本的注意事項 - 有用的提示
注釋： 請始終將正斜杠添加到子文件夾。假如這樣書寫鏈接：，就會向服務器產生兩次 HTTP 請求。這是因為服務器會添加正斜杠到這個地址，然后創建一個新的請求，就像這樣：。
圖片鏈接
如何使用圖片鏈接。
在當前頁面鏈接到指定位置
如何使用書簽
跳出框架
本例演示如何跳出框架，假如你的頁面被固定在框架之內。
創建電子郵件鏈接
本例演示如何如何鏈接到一個郵件。（本例在安裝郵件客戶端程序后才能工作。）
建電子郵件鏈接 2
本例演示更加復雜的郵件鏈接。
HTML 鏈接標簽
| 標簽 | 描述 |
|---|---|
| <a> | 定義一個超級鏈接 |
如您還有不明白的可以在下面與我留言或是與我探討QQ群308855039，我們一起飛！
你的網站如何接入QQ、微信登錄：一站式社交賬號登錄實戰指南
**引言：擁抱社交網絡，無縫對接用戶體系**
在現代Web開發中，為了提高用戶注冊和登錄體驗，越來越多的網站開始支持第三方社交賬號登錄。其中，QQ和微信作為中國最主流的社交平臺，其龐大的用戶基數使得它們成為眾多網站首選的快速登錄方式。本篇文章將以詳盡的技術解析和實例代碼，帶你一步步實現網站接入QQ和微信登錄的功能，讓用戶能一鍵輕松登錄。
---
### **一、了解OAuth 2.0協議**
**標題：掌握OAuth 2.0，理解第三方登錄原理**
QQ和微信登錄均基于OAuth 2.0協議，該協議是一種授權機制，允許用戶讓第三方應用訪問他們存儲在某一服務提供商的應用程序上的私密資源（如個人信息），而不必向第三方應用透露自己的賬戶憑據。
**核心步驟**：
1. 應用注冊并獲取AppID和AppSecret。
2. 用戶同意授權。
3. 第三方應用通過授權碼或直接獲取Access Token。
4. 使用Access Token獲取用戶基本信息。
---
### **二、接入QQ登錄**
**標題：搭建QQ登錄流程及代碼實現**
1. **申請QQ互聯開放平臺賬號與應用創建**
- 注冊并登錄QQ互聯開放平臺（https://connect.qq.com/），創建新應用，獲取到APP ID和APP Key（即AppID和AppSecret）。
2. **網頁端QQ登錄按鈕集成**
```html
<!-- 引入QQ登錄JS SDK -->
<script src="http://connect.qq.com/widget/sdk.js"></script>
<!-- 創建登錄按鈕 -->
<button id="qq-login-btn">使用QQ登錄</button>
<script>
document.getElementById('qq-login-btn').addEventListener('click', function() {
QC.Login({
btnId: "qq-login-btn",
scope: "get_user_info", // 請求用戶授權范圍
success: function(authResult) {
// 成功獲取授權，進一步獲取Access Token
QC.api('get_login_info', {}, function(result) {
// 在這里獲取到用戶的OpenID和Access Token
var accessToken = result.access_token;
var openId = resultopenid;
// 發送請求至您的服務器，完成登錄邏輯
});
},
fail: function(error) {
console.log('QQ登錄失?。?#39; + error);
}
});
});
</script>
```
3. **服務器端驗證與用戶信息獲取**
- 服務器端使用獲取的Access Token向騰訊服務器請求用戶信息，并在本地系統中綁定或創建用戶賬號。
---
### **三、接入微信登錄**
**標題：微信網頁授權與登錄實現**
1. **微信公眾號或小程序注冊與配置**
- 注冊微信公眾平臺賬號，創建應用獲取AppID和AppSecret。
2. **引入微信JS-SDK及初始化**
```html
<!-- 引入微信JS-SDK -->
<script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>
<script>
wx.config({
debug: false,
appId: 'YOUR_APP_ID',
timestamp: YOUR_TIMESTAMP,
nonceStr: 'YOUR_NONCE_STR',
signature: 'YOUR_SIGNATURE',
jsApiList: ['onMenuShareTimeline', 'onMenuShareAppMessage', 'login']
});
wx.ready(function () {
document.getElementById('wechat-login-btn').addEventListener('click', function() {
wx.login({
success: function(res) {
var code = res.code; // 獲取code
// 發送code到服務器，換取Access Token和OpenID
},
fail: function(err) {
console.error('微信登錄失?。?#39;, err);
}
});
});
});
</script>
<button id="wechat-login-btn">使用微信登錄</button>
```
3. **服務器端調用微信接口驗證**
- 使用從客戶端發送過來的`code`向微信服務器請求Access Token和OpenID，再通過Access Token獲取用戶基本信息。
---
### **四、安全與注意事項**
**標題：確保接入過程中的安全與合規**
- **保證用戶數據安全**：在交換、存儲和使用用戶信息的過程中，務必遵守相關法律法規，對用戶數據加密傳輸和妥善保管。
- **刷新Access Token**：Access Token具有有效期，及時刷新并更新數據庫中的記錄。
- **異常處理**：設計完善的錯誤處理機制，包括但不限于授權失敗、網絡異常等情況。
**結論：**
通過以上詳細的步驟與代碼示例，您已掌握了如何在網站中實現QQ和微信登錄功能。然而，接入第三方登錄不僅僅是技術上的對接，更關乎用戶體驗、用戶隱私保護以及遵循相關法規政策。在實施過程中，不斷優化和完善登錄流程，將是打造優質Web產品的重要環節。愿這份指南能助您在實踐過程中少走彎路，迅速實現社交賬號登錄功能，提升用戶黏性和活躍度。
望大家擁有愛情
這周過完就2022年了，為了幫助我的室友在年末順利脫單，22年有個完美的愛情，特地找了10款不同的表白代碼幫助她脫單，廢話不多說，直接看效果。（文末有源碼獲取方式）
故事的開始
故事的結束
故事結束了，下面我們一起來看下干貨，喜歡哪個就拿哪個，總有一個適合的。
1、愛心樹
// 修改文字部分
<span class="say"> ? My crush story</span><br>
<span class="say"> </span><br>
<span class="say"> For xxx</span><br>
<span class="say"> </span><br>
<span class="say"> ? 不經意相識，或許是緣分，或許是注定的。</span><br>
<span class="say"> </span><br>
<span class="say"> ? 第一次認識你，感覺很親切，總想多看你一眼。</span><br>
<span class="say"> </span><br>
<span class="say"> ? 就算因為誤會而淡漠，我還在想念你的好。</span><br>
<span class="say"> </span><br>
<span class="say"> ? 那次你我共同的朋友告訴我，你對我的印象。</span><br>
<span class="say"> </span><br>
<span class="say"> ? 之后不敢再出現在你的面前，或許你是對的。</span><br>
<span class="say"> </span><br>
<span class="say"> ? 我會默默守候著你。</span><br>
<span class="say"> </span><br>
<span class="say"> ? You are my crush girl..永遠..</span><br>
<span class="say"> </span><br>
<span class="say"><span class="space"></span> ------ TTFY ------</span>
...
//修改時間部分
var together = new Date();
together.setFullYear(2018, 05, -11); //剛在一起的時間，時間年月日2、代碼表白式+愛心
// 修改文字內容
<span class="space"/><span class="comments">* 昨晚午夜的初次相遇,</span><br />
<span class="space"/><span class="comments">* 所以我寫一些代碼來顯示我對你的愛.</span><br /> <span class="space"/><span class="comments">*/</span><br />
Boy i = <span class="keyword">new</span> Boy(<span class="string">"BF"</span>);<br />
Girl u = <span class="keyword">new</span> Girl(<span class="string">"GF"</span>);<br />
<span class="comments">// On October 15, 2019, I told you I love you.. </span><br />
i.love(u);<br />
<span class="comments">// 但是,我不知道你對我感覺如何
?</span><br />
u.sayOtherthing();<br />
<span class="comments">// 你是否對我這個突然間冒出來的人有好感呢?</span><br />
<span class="keyword">var</span> reason=i.ask(u);<br />
<span class="comments">// 我希望你能給我機會和時間讓我們彼此了解 .</span><br />
$("body").append(reason);<br />
<span class="comments">// 別擔心,我不是壞人!我要保護你.</span><br />
<span class="comments">// 愿上天能賜給我們緣分.</span><br />
i.takeCareOf(u);<br />
<span class="comments">// 我會一直等待,直到你冰封的心融化,因為我有信心..</span><br />
<span class="keyword">boolean</span> isAccept = <span class="keyword">false</span>;<br />
<span class="keyword">while</span> (isAccept) {<br />
<span class="placeholder"/>i.waitFor(u);<br />
<span class="placeholder"/><span class="comments">// 我認為這是一個重要的決定</span><br />
<span class="placeholder"/><span class="comments">// 讓我幫助你釋懷過去不開心的事情.</span><br />
<span class="placeholder"/>isAccept = u.thinkOver();<br />
}<br />
<span class="comments">// 然后開始我們的開始,和你幸福的生活.</span><br />
...
<div id="messages">
xxx, I have fallen in love with you //修改為xxx為你心愛的她
<div id="loveu">
Love u forever and ever.<br/>
<div class="signature">- TTFY</div>3、小文章+愛心
// 修改文章內容
<span class="comments">親愛的：xxx</span><br>
<span class="space"><span class="comments">好想你！</span></span><br>
<span class="space"><span class="comments">只有在你的微笑里，我才有呼吸，還貪戀著你的風情，誘惑著你的神秘，埋葬了我的愛情，脈脈之情如一溪春水，快刀難斬斷，隨著天各一方的時間越來越長，我的思念也越來越深，我很想找一個萬籟俱寂的深夜或一個陽光明媚的早晨，把許多心底的惆悵、寂寞向你傾訴。親愛的，我們的故事是最感人，最真實的，早安，我永恒的愛人，雖然我尚未起床，但思想已經飛到你的身邊來了，不管今世也好來世也好，我所要的只有你。我要與你同坐在有著月光的草坪上，一起遙望著繁星點綴的夜空，講述那人間古老的愛情神話。人生不止，寂寞不已。寂寞人生愛無休，寂寞是愛永遠的主題。</span><br>
<span class="space"><span class="comments">親愛的，在這沒有月的漆黑的夜里，我獨自坐在窗前寫著這封信，希望睡前可以吻你；希望睡時可以抱著你；希望醒來可以看到_</span></span></span></div>
<div id="loveHeart">
<canvas id="garden" width="670" height="625"></canvas>
<div id="words" style="position: absolute; top: 260.5px; left: 755px;">
<div id="messages" style="display: block;">
親愛的, 這是我們認識的第
<div id="elapseClock"><span class="digit">0</span> days <span class="digit">19</span> hours <span class="digit">44</span> minutes <span class="digit">40</span> seconds</div>
</div>
<div id="loveu" style="display: block;">
永遠愛你，一輩子，永不變！<br>
...
// 修改在一起的時間
var together = new Date();
together.setFullYear(2019, 5, 20); //剛在一起的時間，時間年月日4、死皮賴臉式
// html中代碼修改
<p>我觀察你很久了</p>
<h1>小姐姐做我對象好不好?</h1>
<img src="images/1.jpg">
<div class="bottom">
<div class="left" id="hao">好</div>
<div class="right" id="buhao">不好</div>
</div>
...
// js中代碼修改
if(Dianji==1){
alert("小姐姐在考慮一下唄");
}else if(Dianji==2){
alert("你是我見過的最帥氣善良可愛的男孩");
}else if(Dianji==3){
alert("一生一世愛你");
}else if(Dianji==4){
alert("家務我全干");
}else if(Dianji==5){
alert("不藏私房錢");
}else if(Dianji==6){
alert("房子寫你名");
}else if(Dianji==7){
alert("工資全上交");
Dianji=1;
}
}
hao.οnclick=function(){
alert("小姐姐終于同意了，我愛你么么噠");
}5、旋轉的照片墻
6、千紙鶴
7、文字愛心
// 修改生成愛心的文字
<textPath xlink:href="#partialPath" startOffset="12">What's in a name? That which we call a rose By any other word would smell as sweet...</textPath> 8、煙花+蛋糕
9、紅玫瑰
10、死皮賴臉+煙花
// 修改文字內容
<script type="text/javascript">
$(function() {
$('#yes').click(function(event) {
modal('我就知道小姐姐您一定會愿意的。(^_^)', function() {
$('.page_one').addClass('hide');
$('.page_two').removeClass('hide');
// typeWrite();
fireworks();
});
});
$('#no').click(function(event) {
modal('明人不說暗話！', A);
});
});
function A() {
modal('我喜歡你！', B);
}
function B() {
modal('我知道你在等我這一句話', C);
}
function C() {
modal('請您不要拒絕我', D);
}
function D() {
modal('拒絕我，不存在的', E);
}
function E() {
modal('這輩子都不可能讓你離開我', F);
}
function F() {
modal('跟我走吧', G);
}
function G() {
modal('房產證上寫你名', H);
}
function H() {
modal('我會做飯', I);
}
function I() {
modal('愛你。么么噠！', J)
}
function J() {
modal('行，我們去民政局登記吧', function() {
fireworks();
});
}直接txt打開修改文件中文字即可，不會的可以私信交流溝通，或者發文字直接幫改。
只要私信過來，都免費送源碼（當然我這也希望大家走過路過，點個贊，收藏下，轉發下），祝大家早日脫單，有對象的祝更加甜蜜。
*請認真填寫需求信息，我們會在24小時內與您取得聯系。
