10

HTML要素にテキストを含めることができるかどうかを(純粋なjavascriptまたはjQueryを使用して)テストできるクリーンで堅牢な方法はありますか?

たとえば、<br><hr>または<tr>にはテキスト ノードを含めることはできませんが、<div><td>または<span>はできます。

このプロパティをテストする最も簡単な方法は、タグ名を制御することです。しかし、これは最善の解決策ですか?最悪の部類だと思います…

編集:質問の意味を明確にするために、完璧な答えは2つの問題を考慮する必要があることを指摘する必要があります:

  1. HTML 標準に従って、要素にテキスト ノードを含めることができますか?
  2. 要素にテキストが含まれている場合、それは表示されますか?

明らかに、前のリストの各ポイントに対してサブアンサーがあります。

4

3 に答える 3

0

ブラックリストは非常にオーソドックスな方法であることにほぼ同意しますが、実際にその能力をテストする必要がある場合、これは私が考える 1 つの方法です (いくつかのjqueryを使用):

isTextContainerTag=function(tagName){
    try{       
        var test = $('<'+tagName+'></'+tagName+'>');
        test.html(123);
        if(test.html()=='123'){
            return true;   
        }else{
            return false;   
        }
    }
    catch(err){return false;}
}

さまざまなタグ名で Chrome でテストしたところ、次の結果が得られました。

    console.log('input',isTextContainerTag('input'));//answer:false
    console.log('textarea',isTextContainerTag('textarea'));//true
    console.log('option',isTextContainerTag('option'));//true
    console.log('ul',isTextContainerTag('ul'));//true
    console.log('li',isTextContainerTag('li'));//true
    console.log('tr',isTextContainerTag('tr'));//true
    console.log('td',isTextContainerTag('td'));//true
    console.log('hr',isTextContainerTag('hr'));//false
    console.log('br',isTextContainerTag('br'));//false
    console.log('div',isTextContainerTag('div'));//true
    console.log('p',isTextContainerTag('p'));//true
    console.log('html',isTextContainerTag('html'));//false
    console.log('body',isTextContainerTag('body'));//false
    console.log('table',isTextContainerTag('table'));//false
    console.log('tbody',isTextContainerTag('tbody'));//true

次の 2 つの例で、jquery "prop" を使用していくつかの実際のタグをテストすることもできます。

<div id="A">AAAAAA</div>
<br id="B">

これにより、次のことが得られます。

var obj1 = $('#A').prop('tagName');
var obj2 = $('#B').prop('tagName');
console.log('id:A (div)',isTextContainerTag(obj1));//true
console.log('id:B (br)',isTextContainerTag(obj2));//false

完璧にはほど遠いとは思いますが、調べるのは楽しかったです。

于 2013-11-05T15:56:46.710 に答える