如何更改我的<html>的第一個班級名稱並保留其他班級？

我有以下HTML：如何更改我的<html>的第一個班級名稱並保留其他班級？

<html class="black abc"> or 
<html class="red def"> or 
<html class="red this is a test"> 
etc ...

使用下面的函數，我可以得到價值一流的：

var color = html.className.split(' ')[0]

我如何能在第一類更改爲別的東西。例如，我怎麼可能改變：

<html class="black abc"> 

to 

<html class="red abc">

來源

2013-10-22 Melina

var tags = document.getElementsByTagName('html')[0].className.split(' '); //Get a list of tags. 
tags[0] = 'foo'; //Change the 0th tag 
html.className = document.getElementsByTagName('html')[0].join(' '); //Put the tag list into the html

來源

2013-10-22 04:29:32 bjb568

這是否會添加類也之間的空間？ – Melina

@Melina現在它會。 – bjb568

在這裏你去：

var tags = document.getElementsByTagName('html')[0]; 
var classList = tags.className.split(' '); //Converting class string to an array 
classList[0] = 'red'; // Changing the first class 
tags.className = classList.join(' '); // Adding updated class list

來源

2013-10-22 04:45:19

我認爲你正在尋找這個（只是需要改變任何HTML元素的class屬性）

你也可以用jQuery做到這一點，

$("ID_OF_YOUR_ELEMENT").removeClass('PREVIOUS_CLASS').addClass('NEW_CLASS');

也有可做到這一點JQuery的其他選項支持.toggleClass

來源

2013-10-22 04:45:52

這不是一個jQuery的問題 –

@om_deshpande我知道，但我回答，因爲想給更多的選擇，以不同的方式做同樣的事情。 –

您通常應該只在未標記jQuery的東西上發佈pure-js答案。 – bjb568

使用班級列表

刪除類

var elem = document.getElementsByTagName('html')[0].classList.remove("black");

添加類

var elem = document.getElementsByTagName('html')[0].classList.add("red");

來源

2013-10-22 05:01:45 Hellgorithm

你確定這是一個跨瀏覽器的解決方案嗎？ –

@om_deshpande不是跨瀏覽器的解決方案，除非您的受衆是最新的（[caniuse]（http://caniuse.com/#feat=classlist）），但它是問題的最佳解決方案。只修改元素上的單個類名稱。 – Jeremy

沒有IE 9的支持？真的無法與此相提並論。 – bjb568

定義的函數小號遵循<head>的<script> -section：

function class_replace_with(new_classname) 
{ 
    var color1=html.className.split(' ')[0]; 
    html.className=html.className.substring(0, html.className.indexOf(' ')) + new_classname + html.className.substring(html.className.indexOf(' ')); 
}

因此，對於你特定目的調用該函數爲：

class_replace_with('red');// as you have used red as the replacement for black.

來源

2013-10-22 05:36:22

如何更改我的<html>的第一個班級名稱並保留其他班級？

回答

相關問題