Встраивание дополнительных стилей с noscript
Было бы много способов достичь своей цели, но если вы хотите использовать экземпляр vue, вам нужно назначить экземпляр vue в переменной, как показано ниже
var app = new Vue({
, а затем изменить counter на app.counter [ 118]
var app = new Vue({
el: '#app',
data: {
counter: 1
},
template: `<div id="el1" :data-val="counter">
<div>Value: {{ getCounter }}</div>
<div><input type="text" v-model="counter"></div>
</div>`,
computed: {
getCounter: function(val, oldVal){
return this.callMethod1(this.counter);
}
},
methods:{
callMethod1: function(){
console.log("callMethod1 called with counter value : "+this.counter);
return this.counter;
}
}
});<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<div id="app"></div>4 ответа
Разрешать проблему проверки: noscript только позволяется в body элемент, style только позволенным в head. Поэтому последнему не разрешают в первом.
На общем вопросе: Вы захотите сделать div элемент видимый по умолчанию, затем скроете его с помощью CSS + JavaScript. Это - 'прогрессивное улучшение' модель. Я замечаю, что Вы говорите, что "не хотите делать это из-за мерцания", но я не уверен точно, что вызывает это - возможности - Вы, может зафиксировать его, поэтому возможно, необходимо отправить что как вопрос.
Используйте script блок в head для добавления style элемент с document.write:
<head>
...
<script type="text/javascript">
//<![CDATA[
document.write('<style type="text/css">.noscript{display:none}</style>');
//]]>
</script>
...
</head>
Какую ошибку проверки Вы получаете? <noscript> должен быть позволен в XHTML, но это - блочный уровень, поэтому удостоверьтесь, что это не находится в <p>, <span>, и т.д.
Носкрипт в заголовке является допустимым HTML5. Раньше это не действовало. Я только что протестировал его, он работает в текущих версиях Firefox, Safari, Chrome, Opera и IE.
<!doctype html>
<html>
<head>
<noscript>
<style>body{background:red}</style>
</noscript>
</head>
<body>
<p>is this red? it should <script>document.writeln("not");</script> be. <noscript>indeed.</noscript></p>
</body>
</html>