Могу ли я использовать китайские символы в именах классов CSS?

Можно ли использовать китайские имена классов для моих классов CSS? Я пытаюсь получить китайское слово с помощью jQuery, а затем создать элементы img с классами, названными китайскими словами.

Например, у меня есть файл с именем 2020_Cars_哈喽_1.jpg, и я создал код, который принимает год, категорию (автомобили) и китайское слово, являющееся названием альбома, и создает элемент img с классами в соответствии с именем файла в чтобы отфильтровать изображения позже.

У меня есть пример здесь, где вы можете увидеть категории, которые без проблем переведены в классы, и %46%bd%, которые китайские слова, которые я не смог успешно преобразовать в имя класса.

Любые предложения, пожалуйста?

Код jQuery, который берет имя файла и разбивает его на классы:

 $.ajax({
     url: dir,
     success: function(data){
         $(data).find("a:contains(.JPG)").each(function(){
             // will loop through
             var images = $(this).attr("href");
             var splittedName = images.split('_');
             var classesToAdd = 'thumbnailpic';
             for(var i=0;i<3;i++){
                 classesToAdd+=' '+splittedName[i];
             }

             if(years.indexOf(splittedName[0])===-1){
                 years.push(splittedName[0]);
             }
             if(categories.indexOf(splittedName[1])===-1) {
                 categories.push(splittedName[1]);
             }
             if(albums.indexOf(splittedName[2])===-1) {
                 albums.push(splittedName[2]);
             }

             $('.gallery').append('<img class="'+classesToAdd+'" src="'+dir+'/'+images+'"'+'>');

         });

         for(var a=0;a<years.length;a++){
             $('.years').append('<div id="filter-button" class="filter-select" >'+years[a]+'</div>');
         }

         for(var b=0;b<categories.length;b++){
             $('.categories').append('<div id="filter-button" class="filter-select">'+categories[b]+'</div>');
         }

         for(var c=0;c<albums.length;c++){
             $('.albums').append('<div id="filter-button" class="filter-select">'+albums[c]+'</div>');
         }
         hideBigPic();
         $('.filters').fadeIn(1000);
         $('.gallery').fadeIn(1000);
     }
 });

Заранее спасибо!


person holyubuntu    schedule 17.11.2017    source источник
comment
Возможный дубликат Какие символы допустимы в именах/селекторах классов CSS?   -  person Sebastian Brosch    schedule 17.11.2017


Ответы (1)


Да, вы можете использовать китайские символы в качестве имен классов и селекторов.

div {
  width: 100px;
  height: 100px;
}

.tomato {
  background: tomato;
}

.蓝色 {
  background: navy;
}
<div class="蓝色"></div>
<div class="tomato"></div>
<br>
<button onclick="console.log(document.querySelector('.蓝色'))">Find Element</button>

Но похоже, что реальный вопрос здесь заключается в том, как вы превращаете закодированные символы URL (% 46 и т. д.) обратно в реальные символы, и для этого вам нужно decodeURIComponent

console.log(decodeURIComponent('%E8%93%9D'))

Надеюсь, это ответит на все ваши вопросы.

person Andrew Bone    schedule 17.11.2017