js怎麼修改網頁,如何修改網頁內容

本文目錄一覽：

• 1、如何使用JavaScript的className屬性改變網頁的樣式？
• 2、怎麼用JAVASCRIPT腳本修改網頁的內容
• 3、JavaScript是如何改變網頁的CSS樣式的？
• 4、怎麼用JS修改頁面中指定的元素內容
• 5、JS網頁源碼怎麼修改，重賞

如何使用JavaScript的className屬性改變網頁的樣式？

網頁的樣式一般都定義在了css的文件中，而JavaScript中的className的屬性能讓css中的樣式動態的應用到網頁的元素上。比如，在css中有樣式.example。代碼如下：

.example {

color: #fff;

font-size 1em;

text-align: right;

}

要用JavaScript動態的應用到網頁上，可以使用如下類似的代碼：

function preparePage() {

//當mainContent元素被點擊，mainContent的樣式將會改變

document.getElementById(“mainContent”).onclick = function() {

//檢查當前mainContent的樣式，若是example，則將樣式取消。

//取消樣式直接將className屬性賦值為空字元串」」就行。

//若mainContent的樣式不是example，則應用example樣式。

if( document.getElementById(“mainContent”).className == “example”) {

document.getElementById(“mainContent”).className = “”;

} else {

document.getElementById(“mainContent”).className = “example”;

}

};

}

window.onload = function() {

preparePage();

}

通過上面的JavaScript代碼，我們可以通過點擊來控制mainContent元素的樣式。上面的代碼是從秒秒學上扣出來的，如果你想要完整的案例，可以在秒秒學的《使用JavaScript美化界面》一章中找到。

怎麼用JAVASCRIPT腳本修改網頁的內容

先打開一個網頁，然後在地址欄中輸入以下代碼，然後回車就行了。

javascript:documenntentEditable= ‘true ‘;document.designMode= ‘on ‘;void(0);

JavaScript是如何改變網頁的CSS樣式的？

通常我們將網頁的樣式和內容分開，樣式放在css文件，內容放在html文件，當html文件需要用到樣式的時候，直接引用css中定義的樣式就可以了。其實JavaScript也能使用css文件或直接改變樣式的屬性來動態的改變網頁的樣式。

1、JavaScript設置內聯樣式

改變樣式最直接的方法就是改變元素節點的style屬性。如：

myElement.sytle.color = 「red」;

myElement.sytle.left = 「40px」;

myElement.sytle.backgroundRepeat = 「repeat-x」;

JavaScript設置內聯樣式時，採用和css設置樣式一樣的風格。如設置myElement的color屬性時，我們可以賦值任何在css中可以用的值，所以這裡除了可以使用」red」，還可以使用」blue」, 」yellow」或十六進位的」#ff0000」。

另外用JavaScript改變網頁的屬性還需要注意2點：

l JavaScript中採用駝峰命名法：在css中，屬性名中的單詞之間是用橫杠隔開，如font-weight, background-color。但在JavaScript中，橫杠可能被認為是減號，所以採用駝峰命名法，單詞之間不用橫杠，如font-weight在JavaScript中應該寫成fontWeight;而background-color寫成backgroundColor。

l JavaScript中屬性值為字元串：在css中，屬性值都寫在雙引號中，即要用字元串來給css相關屬性賦值，同樣當屬性值有單位時，我們需要將單位也寫在字元串中。

2、JavaScript設置外部樣式

當你需要改變的樣式已經在css文件中定義了，我們也可以用JavaScript直接用定義好的css樣式。如下格式：

myElement.className = 「someCSSclass」;

同樣需要注意幾點：

l 不要將className寫成class，因為class是JavaScript保留的關鍵字，我們不能使用。

l 將定義在css中的樣式直接賦值給className，就能改變myElement元素的樣式。

l 當要刪除元素的樣式，可以給className屬性賦值為空。如：

myElement.className = 「」;

教程網 站-秒秒學上的JavaScript課程有一個章節專門講解JavaScript改變樣式的內容，可以看看，希望對你有幫助。

怎麼用JS修改頁面中指定的元素內容

js可以通過文本所在標籤的id獲取該標籤對象，然後修改其內容，如：

document.getElementById(‘標籤id’).innerHTML

=

‘要修改的文本內容’;

該方法可以在要修改的文本內容中加html標籤，如果只是純文本的話，

可以使用innerText,

document.getElementById(‘標籤id’).innerText=

‘要修改的文本內容’;

JS網頁源碼怎麼修改，重賞

首先使用一個有調試工具的的瀏覽器

如：谷歌，火狐

然後按f12 調出網頁開發工具

以谷歌舉例

選擇sources標籤

點擊左上角小箭頭標誌

可以看到所有引用的js文件

如果你定位了你需要改的js

在控制檯面板中可以直接修改

此時會進入一個虛擬機狀態VIM

但是谷歌有sandbox機制

會屏蔽用戶對非本地源碼的修改