HTML怎么防止用戶復(fù)制？

TML本身并不能完全防止用戶復(fù)制內(nèi)容，因?yàn)镠TML是一種標(biāo)記語(yǔ)言，它只負(fù)責(zé)定義網(wǎng)頁(yè)的結(jié)構(gòu)和內(nèi)容，而不涉及用戶的行為。但是，您可以使用一些技術(shù)來防止用戶復(fù)制您的網(wǎng)頁(yè)內(nèi)容，例如：

1. 禁用右鍵菜單：您可以使用JavaScript代碼來禁用右鍵菜單，這樣用戶就無(wú)法使用右鍵菜單復(fù)制您的內(nèi)容。但是，這種方法并不可靠，因?yàn)橛脩羧匀豢梢允褂闷渌椒▉韽?fù)制內(nèi)容。

2. 使用CSS樣式：您可以使用CSS樣式來隱藏您的內(nèi)容，例如將文本顏色設(shè)置為與背景顏色相同，這樣用戶就無(wú)法看到您的內(nèi)容，也就無(wú)法復(fù)制。但是，這種方法可能會(huì)影響您網(wǎng)頁(yè)的可讀性和可訪問性。

3. 使用JavaScript代碼：您可以使用JavaScript代碼來防止用戶復(fù)制您的內(nèi)容，例如在用戶嘗試復(fù)制時(shí)彈出警告框或禁用復(fù)制功能。但是，這種方法可能會(huì)影響用戶體驗(yàn)，并且用戶仍然可以通過其他方法來復(fù)制內(nèi)容。

總之，HTML本身并不能完全防止用戶復(fù)制內(nèi)容，但是您可以使用一些技術(shù)來增加復(fù)制的難度。但是，這些技術(shù)可能會(huì)影響您網(wǎng)頁(yè)的可讀性和可訪問性，因此需要謹(jǐn)慎使用。

行文本超出隱藏

<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>Document</title>
<style type="text/css">
*{
margin: 0;
padding: 0;
}
p{
width: 600px;
margin: 100px auto;
border: 1px solid red;

/*文本是否換行*/
white-space: nowrap;
/*文本超出: 顯示省略符號(hào)來代表被修剪的文本。*/
text-overflow: ellipsis;

/*超出隱藏*/
overflow: hidden;
}
</style>
</head>
<body>
<p>是指陰影的垂直偏移量，其值也可以是正或負(fù)值，如果為正值，陰影在對(duì)象的底部，反之其值為負(fù)值時(shí)，陰影在對(duì)象的頂部；
陰影模糊半徑.................................................
</p>
</body>
</html>

多行文本超出隱藏

<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>Document</title>
<style type="text/css">
*{
margin: 0;
padding: 0;
}
p{
width: 600px;
margin: 100px auto;
border: 1px solid red;

display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
overflow: hidden;
}
</style>
</head>
<body>
<p>是指陰影的垂直偏移量，其值也可以是正或負(fù)值，如果為正值，陰影在對(duì)象的底部，反之其值為負(fù)值時(shí)，陰影在對(duì)象的頂部；
陰影模糊半徑......
</p>
</body>
</html>

注意: 目前只在webkit內(nèi)核瀏覽器(Chrome、Safari、移動(dòng)端瀏覽器)中生效

avascript是一門弱類型語(yǔ)言，意思就是語(yǔ)言中的數(shù)據(jù)類型，很輕易就能被改變

比如定義一個(gè)變量值為數(shù)字，然后重新給他賦值為字符串，類型就由數(shù)字類型轉(zhuǎn)為了字符串類型。

類型的轉(zhuǎn)換，可以有很多種方法，例如在js中常用的parseInt、toString、等方法，這些方法都是強(qiáng)制將某個(gè)類型轉(zhuǎn)為指定的類型。

除了這些方法，還有一些特殊應(yīng)用場(chǎng)景，會(huì)將類型悄悄的進(jìn)行轉(zhuǎn)換，如下幾種情況：

1、數(shù)學(xué)運(yùn)算

如果一個(gè)數(shù)字跟另一個(gè)其他類型的數(shù)據(jù)進(jìn)行數(shù)學(xué)運(yùn)算時(shí)，另一個(gè)數(shù)據(jù)會(huì)被轉(zhuǎn)為數(shù)字類型進(jìn)行運(yùn)算，例：

var a = 1;
var b = true;
var c = a + b;
console.log(c); // 2 - 此時(shí)的布爾類型true被轉(zhuǎn)為了數(shù)字1，進(jìn)行了數(shù)學(xué)加法運(yùn)算

var a = 3;
var b = undefined;
var c = a + b;
console.log(c); // NaN - 此時(shí)的b被轉(zhuǎn)為了數(shù)字類型進(jìn)行了數(shù)學(xué)運(yùn)算

注意：加法比較特殊，因?yàn)榉?hào)+，除了可以進(jìn)行數(shù)學(xué)加法以外，還可以進(jìn)行字符串的拼接。例：

var a = 2;
var b = [1,2,3]
var c = a / b;
console.log(c); // NaN - 此時(shí)的b被轉(zhuǎn)為了數(shù)字類型
?
var a = 2;
var b = [1,2,3]
var c = a + b;
console.log(c); // 21,2,3 - 此時(shí)的a和b不再是加法運(yùn)算，而是進(jìn)行了拼接

2、字符串拼接

當(dāng)+符號(hào)左右兩邊有一個(gè)是字符串的時(shí)候，另一個(gè)也會(huì)轉(zhuǎn)為字符串進(jìn)行拼接，例：

var a = 2;
var b = '3';
var c = a + b;
console.log(c); // 23 - 此時(shí)的a被轉(zhuǎn)為了字符串，進(jìn)行了拼接

3、比較運(yùn)算

當(dāng)比較運(yùn)算符(除相等比較和全等比較)左右兩邊有一個(gè)是數(shù)字的時(shí)候，另一個(gè)也會(huì)轉(zhuǎn)為數(shù)字進(jìn)行比較大小，例：

var a = 2;
var b = '10';
console.log(a>b) // false - 說明b被轉(zhuǎn)為數(shù)字10進(jìn)行了大小比較

4、判斷條件

所有被放在if分支語(yǔ)句的小括號(hào)中的代碼會(huì)被轉(zhuǎn)為布爾類型，例：

var a = 2;
if(a){
 console.log('a變量是true'); // a變量是true - 說明變量a的2被轉(zhuǎn)為了布爾值true
}else{
 console.log('a變量是false');
}
?
var b;
if(b){
 console.log('b變量是true');
}else{
 console.log('b變量是false'); // b變量是false - 說明b變量undefined被轉(zhuǎn)為了布爾值false
}

5、date輸出

我們知道，new 一個(gè)構(gòu)造函數(shù)會(huì)得到一個(gè)對(duì)象，但是new Date()之后，輸出的卻是一個(gè)字符串，例：

var d = new Date();
console.log(d); // Mon Mar 15 2021 17:50:25 GMT+0800 (中國(guó)標(biāo)準(zhǔn)時(shí)間)
// 這說明，new出來的對(duì)象d，在輸出的時(shí)候被悄悄的轉(zhuǎn)換成了字符串輸出了

6、對(duì)象數(shù)組輸出在頁(yè)面

當(dāng)在控制臺(tái)輸出一個(gè)數(shù)組或?qū)ο蟮臅r(shí)候，是本省的類型顯示，例：

var arr = [1,2,3,4];
var obj = {name:"張三",age:12}
console.log(arr);
console.log(obj);

輸出效果如下圖：

但是如果將數(shù)組或?qū)ο笤谖谋局休敵龅脑挘瑪?shù)組和對(duì)象會(huì)默認(rèn)調(diào)用自己原型中的toString方法，以字符串形式顯示在文本中，例：

var arr = [1,2,3,4];
var obj = {name:"張三",age:12}
document.write(arr)
document.write(obj)

文本中顯示如下：

數(shù)組和對(duì)象其實(shí)已經(jīng)調(diào)用了他們?cè)蜕系膖oString方法，被轉(zhuǎn)為了字符串，例：

var arr = [1,2,3,4]; 
var obj = {name:"張三",age:12} 
console.log(arr.toString()); 
console.log(obj.toString());

控制臺(tái)顯示如下圖：

隱形轉(zhuǎn)換在多處出現(xiàn)，我們?cè)诰幊痰臅r(shí)候，需要謹(jǐn)慎小心，熟悉后可以對(duì)之進(jìn)行利用，例如判斷一個(gè)數(shù)據(jù)或?qū)ο笾械闹凳欠翊嬖跁r(shí)，可以利用分支語(yǔ)句的條件中的隱形轉(zhuǎn)換來搞定。

在線咨詢

上一篇：碎片時(shí)間學(xué)編程「112]：轉(zhuǎn)義 HTML
下一篇：HTML5：開啟現(xiàn)代網(wǎng)頁(yè)設(shè)計(jì)的新篇章

您的項(xiàng)目需求

*請(qǐng)認(rèn)真填寫需求信息，我們會(huì)在24小時(shí)內(nèi)與您取得聯(lián)系。

整合營(yíng)銷服務(wù)商