如何使用JavaScript或CSS更改頁面上的字符串

如何使用JavaScript或CSS更改頁面上的字符串。如何使用JavaScript或CSS更改頁面上的字符串

我將有包含用逗號分隔的標籤即

<a name="tagslist">Skrillex, dubstep, dance</a>

我想使用JavaScript採取這些詞和不同的風格他們，使他們看上去並不像它們被分開約50元逗號，但在不同的路線。問題是頁面上可能有不定數量的標籤列表。

有什麼辦法可以輕鬆實現？

來源

2013-02-10 Dean Meehan

這似乎是一個用例，並非爲客戶端解決方案量身訂做，而是服務器端解決方案（想想PHP）。但你應該能夠在Javascript中完成你想要的東西。 – 2013-02-10 21:47:51

你想讓每個單詞都在自己的錨標籤內嗎？或者只有一個錨點標記，並用單詞分隔一行？ – MikeB 2013-02-10 21:47:56

$('a[name="tagslist"]').html(function(_, html){ 
    var arr = [], 
     tags = html.split(/\s*,\s*/); 

    for (var i=0; i<tags.length; i++) 
     arr.push('<div class="whatever">' + tags[i] + '</div>'); 

    return arr.join(''); 
});

來源

2013-02-10 21:50:55

這將產生無效的HTML。您不能在塊內元素中放置塊級元素。 – 2013-02-10 21:52:08

是的。但這只是示例代碼。你可以使用'span'代替，並通過CSS來阻止它們。這將是有效的。 – 2013-02-10 21:53:40

跨越'display：block'並將其放置在內聯元素內仍然無效。 – 2013-02-10 21:55:37

-1

你想做什麼是不可能的。更理想的解決辦法是有HTML渲染，像這樣：

<span class="tagslist"> 
    <a href="#">Skrillex</a> 
    <a href="#">dubstep</a> 
    <a href="#">dance</a> 
</span>

這樣一來，你有過使用CSS樣式完全控制。

來源

2013-02-10 21:51:45

我不認爲你讀了這個問題:) – 2013-02-10 22:40:04

你說你想要在單獨的標籤中設置文本的單獨部分，這是不可能的，如果沒有首先將它們分離成單獨的標籤，這是其他人告訴你做的使用javascript。如果您有能力生成自己生成HTML的能力，則後一種方法非常愚蠢。你自便。 – 2013-02-11 00:01:22

以上部分回答了問題。我需要不改變輸入，但要處理它。數據來自我無法控制的Feed。儘管感謝您的工作，但答案已經解決！ :) – 2013-02-11 15:42:02

考慮使用現有的庫如http://ivaynberg.github.com/select2/#tags

來源

2013-02-10 21:52:17

首先，走不出過去的千禧並使用此HTML：

<div id="tagslist">Skrillex, dubstep, dance</div>

然後，你可以這樣做：

var elm = document.getElementById('tagslist'); 
elm.innerHTML = elm.innerHTML.replace(/, /g,'<br />');

你當然可以做更復雜的事情，像這樣：

elm.innerHTML = "<div class='tag'>"+elm.innerHTML.replace(/, /g,"</div><div class='tag'>")+"</div>";

或者，你可以使用真正的DOM方法：

var elm = document.getElementById('tagslist'), tags = elm.firstChild.nodeValue.split(", "), 
    l = tags.length, i, div; 
elm.removeChild(elm.firstChild); 
for(i=0; i<l; i++) { 
    div = elm.appendChild(document.createElement('div')); 
    div.appendChild(document.createTextNode(tags[i])); 
    // apply styles, className, etc. to div 
}

來源

2013-02-10 21:52:41

'name'屬性是上一個千年嗎？ – mpen 2013-02-10 21:53:57

@Mark我同意，不知道Kolink想說什麼。無論如何，考慮到像標籤列表這樣的事情會在同一頁面上多次出現，使用'id'是一個更糟糕的解決方案。 – 2013-02-10 21:57:57

這對第一個很有用，但其餘的元素仍然不起作用。有什麼方法可以選擇id tagslist中的所有元素嗎？ – 2013-02-10 22:42:07

你將不得不對每一個爲他們進行不同風格的獨立的錨標記。對於它們之間的換行符，可以在它們之間放置br標籤。

來源

2013-02-10 21:54:40 NinJoel

這些項目是從一個JSON提要綁定的，所以我不能在它們被輸入到字段之前改變它們 – 2013-02-10 22:39:38

如何使用JavaScript或CSS更改頁面上的字符串

回答

相關問題