어떻게 처리해야합니까? 코드 유효성 검사 안함 : JS 부족을 보완하기위한 Noscript뿐 아니라 모바일 사용자에게 편의 제공

Question

좋아요, 텍스트가있는 단락 태그가 있습니다. 텍스트는 사용자가 탐색을 볼 수있는 방향을 나타냅니다. (나는 그것이 불필요하다는 것을 알고 있지만, 무엇이든간에). 자,이 값을 본질적으로 "좌측"에서 "상단"으로 자바 스크립트로 변경하여 1 개의 돌로 2 마리의 새를 죽이려고합니다 (네비게이션은 일반적으로 왼쪽에 있으며, 아이폰에서는 위와 같습니다). 그러나 효율성은 noscript를 사용하려고 할 때 발생합니다.

예 :

<script type="text/javascript"> 
    if(navigator.userAgent.indexOf('iPhone') > -1){ 
    document.getElementByClassName('navdir')[0].innerHTML = 'up'; 
    } 
</script> 

------------- 

<p> 
    look <span class="navdir">left<noscript><span> (or up, for mobile)</span></noscript></span> 
    for the navigation section! 
</p> 

좋은 점은은, innerHTML을은 NOSCRIPT 태그입니다 span.navdir의 아이 노드를 삭제합니다 (그리고 내용이다)! 내 문장은 아이폰을 사용하는 사람들뿐만 아니라 자바 스크립트가 부족한 사람들에게 친숙해진다.

유효성이 확인되지 않을 때까지는 모두 기뻤습니다. 나는 google'd이 사실을 noscript는 사실 블록 태그이며, p 또는 span 등등 안에있을 수 없다는 사실에 관한 것입니다.

새로운 효율성을 유지하면서 어떻게 유효성을 검사 할 수 있습니까?

Answer 1

JavaScript로 noscript 태그를 삭제하고 내용을 변경할 수 있습니다. 그러면 사용자가 자바 스크립트를 사용할 수없는 경우에만 원래 내용이 표시됩니다.

<script type="text/javascript"> 
    if(navigator.userAgent.indexOf('iPhone') > -1){ 
    document.getElementByClassName('navdir')[0].innerHTML = 'up'; 
    } 
    else { 
    document.getElementByClassName('navdir')[0].innerHTML = 'left'; 
    } 
</script> 

------------- 

<p> 
    look <span class="navdir">left (or up, for mobile)</span> 
    for the navigation section! 
</p> 

Answer 2

이 더러운 해킹이며, Juhana의 솔루션이 훨씬 더,하지만 난 그것을 어쨌든 말할 것이다 (그런데이 아이폰이 유일한 모바일 장치 ... 아니다)

<script> 
    var style = document.createElement('style'); 
    style.type = 'text/css'; 
    style.innerHTML = '.noscript{display:none;}'; 
    document.getElementsByTagName('head')[0].appendChild(style); 
</script> 
<p> 
    look <span class="navdir">left<span class="noscript"> (or up, for mobile)</span></span> 
    for the navigation section! 
</p>