js使用css文檔介紹內容,jscss

本文目錄一覽：

• 1、js，css，html怎樣使用
• 2、如何使用JS來增加CSS樣式的CLASS內容？
• 3、js 文件中 使用到 css 怎樣處理呢？ 如圖
• 4、js設置css怎麼使用

js，css，html怎樣使用

一、TML是目前最流行的網頁製作語言。互聯網中的網頁大多數都是使用HTML格式展示在瀏覽者面前的。超文本標記語言，即HTML（Hypertext Markup Language），是用於描述網頁文檔的一種標記語言。網頁的本質就是超級文本標記語言，通過結合使用其他的Web技術可以創造出功能強大的網頁。HTML 5是近十年來Web開發標準最巨大的飛躍。和以前的版本不同，HTML 5並非僅僅用來表示Web內容，它的新使命是將Web帶入一個成熟的應用平台，在HTML 5平台上，視頻，音頻，圖像，動畫，以及同電腦的交互都被標準化。

二、級聯樣式表簡稱「CSS」，通常又稱為「風格樣式表（Style Sheet）」，它是用來進行網頁風格設計的。比如，如果想讓鏈接字未點擊時是藍色的，當鼠標移上去後字變成紅色的且有下劃線，這就是一種風格。通過設立樣式表，可以統一地控制HTML中各標誌的顯示屬性。級聯樣式表可以使人更能有效地控制網頁外觀。使用級聯樣式表，可以擴充精確指定網頁元素位置，外觀以及創建特殊效果的能力。

三、JavaScript是一種基於對象和事件驅動並具有相對安全性的客戶端腳本語言。同時也是一種廣泛用於客戶端Web開發的腳本語言，常用來給HTML網頁添加動態功能，比如響應用戶的各種操作。Javascript提供了豐富的運算功能，包括算術運算、關係運算、邏輯運算和連接運算。JavaScript的一個重要功能就是面向對象的功能，通過基於對象的程序設計，可以用更直觀、模塊化和可重複使用的方式進行程序開發。

如何使用JS來增加CSS樣式的CLASS內容？

在頁面內用JS操作CSS除非用AJAX，但操作頁面內的樣式的話，是可以的。操作樣式分為改變直接樣式，改變className和改變cssText三種

一、局部改變樣式

調用方法：

改變className

div id=”demo”測試/div

script

document.getElementById(‘demo’).className=”test”;

/script

改變直接樣式

div id=”demo”測試/div

script

document.getElementById(‘obj’).style.backgroundColor=”#003366″;

/script

二、全局改變樣式

可以通過改變外鏈樣式的的href的值實現網頁樣式的實時切換

link rel = “stylesheet” type=”text/css” id=”css” href=”firefox.css” /

span on click=”javascript:document.getElementById(‘css’).href = ‘ie.css'”點我改變樣式/span

js 文件中 使用到 css 怎樣處理呢？ 如圖

使用css樣式是設置DOM對象的className屬性.

x.className = ‘STYLE1’;

如果要設置style,應該設置css樣式名稱對應的屬性,如果名稱里有連字符-,要去掉後把後一個字母大寫

x.style.fontSize = ’12px’;

x.style.color = ‘#666666’;

js設置css怎麼使用

-moz-, -webkit-, -o-這些都是瀏覽器前綴。box-shadow才是css樣式。

通過js獲取css的box-shadow的方法：

div

{

box-shadow: 10px 10px 5px #888888;

}

js方法：

document.div[0].style.box-shadow = “12px 11px 5px #888888;”;

常用前綴和瀏覽器的對應關係如下：

Firefox: -moz-

Chrome, Safari: -webkit-

Opera: -o-

IE: -ms-

css標準中各個屬性也要經歷從草案(WD)到推薦(REC)的過程，css3中的屬性進展都不一樣。瀏覽器廠商在標準尚未明確情況下提前支持會有風險，同時也會出現有的瀏覽器廠商支持的好，有的支持的不好，所以就用廠商前綴加以區分。

PPK建議如果已成為REC或接近REC的屬性，廠商如果完全實現了w3c的test case，就不用加廠商前綴，像border-radius在ie9下就不用加前綴。