Как я могу “сбросить” стили для данного элемента HTML?

Я работаю над встраиваемым JavaScript, который вставляет элементы HTML на неизвестные страницы. Я не имею никакого контроля над таблицами стилей страниц, в которые я буду вставлять HTML. Проблема состоит в том, что HTML, который я вставляю, будет по ошибке стилизованный страницей, и я хочу предотвратить это.

Что является наименее подробным и/или интенсивно использующим ресурсы для движения об обеспечении элементов, которые я вставляю, точно, поскольку я хотел бы, чтобы они были? Существует ли простой способ очистить все моделирование для данного элемента HTML и детей? В поджигателе, например, можно удалить все моделирование. Я чувствую себя подобно там, и очень наименьшее должно, должен быть собственный способ освободить определенные элементы HTML от правил таблицы стилей?

Пример:

var myHTML = $("<div>my html in here</div>");
myHTML.resetAllStyles();   //<--- what would this function do?
myHTML.appendTo("body");

Я действительно не хочу явно заявлять атрибуты, которые я хочу для каждого элемента, который я вставляю...

PS: у Меня есть большой опыт с JS и CSS, таким образом, можно предположить, что я пойму в значительной степени что-либо, что Вы собираетесь сказать мне.

13
задан Sambo 10 June 2010 в 23:30
поделиться

2 ответа

Я собираюсь выкинуть это как возможность. Как насчет пользовательских тегов для букмарклета? Потребуется немного больше возиться с пользовательским пространством имен xml из-за IE, но, возможно, для вас это сработает.

jQuery, похоже, тоже не возражает.

http://jsfiddle.net/uvfAf/1/

jQuery:

$('#tester').animate({opacity: .3},1000);

HTML:

   // Not the main HTML tags. These are embedded in the body as the root
   //   of the bookmarklet. Scary? Perhaps.
<html xmlns:customtag>
    <style> 
        @media all {  
          customtag\:someElement { 
            width:100px; 
            height: 100px; 
            background: blue; 
            display: block; 
          } 
          customtag\:someOtherElement { 
            width: 50px; 
            height: 50px; 
            background: red; 
            display: block; 
          }
        }
    </style>
    <customtag:someElement id='tester'>test</customtag:someElement>
    <customtag:someOtherElement>test</customtag:someOtherElement>
</html>​

Я использовал эту страницу, чтобы понять, как делать пользовательские теги в IE:

http://happyworm.com/blog/tag/custom-tags/

EDIT:

Похоже, IE хочет, чтобы xmlns были определены в тегах HTML, поэтому я изменил контейнер на . Не уверен в общих последствиях, но, кажется, работает.

Я обновил пример и jsFiddle.

3
ответ дан 2 December 2019 в 02:05
поделиться

Вы не можете запретить элементу наследовать стили CSS от родительских узлов. Все, что вы можете сделать, это перезаписать все унаследованные стили.

2
ответ дан 2 December 2019 в 02:05
поделиться
Другие вопросы по тегам:

Похожие вопросы: