3

基本的な javascript と jquery は理解できますが、たとえば、ユーザーが要素のソース コードを表示できるようにする方法を理解するのに苦労しています。

このようなWebページに要素がある場合

`<p>Hi I'm an element</p>`

このように表示されることは誰もが知っています

Hi I'm an element

しかし、ユーザーにこれをソースコード形式で見てもらいたい

`<p>Hi I'm an element</p>`

これは一体どのように行われますか??

4

3 に答える 3

3

基本的な考え方は、要素の HTML を取得し、プレーンテキストとしてどこかに表示することです。を使用.html()して HTML を取得し.text()、同じ HTML をプレーンテキストとして出力できます。

//on the click of a link
​$('a')​.on('click', function () {

    //append a container with the plain-text HTML of an element
    $('body').append($('<div />').text($('form').html()));
});​​

これがデモです：http://jsfiddle.net/YbJfs/

これは実際のタグを取得しないことに注意してください。ただし<form>、フォームをコンテナーに配置し、コンテナーを選択してから、.html()if そのコンテナーを使用すると、タグも取得できます<form>。

また、HTML をフォーム入力またはテキスト領域に追加する場合.val()は、.text().

ここにデモがあります：http://jsfiddle.net/YbJfs/1/

于 2012-04-19T23:15:49.923 に答える
2

あなたが使用することができます...

element.outerHTML;

...技術的には「ソースコード」ではありませんが。これはブラウザーによってレンダリングされる HTML であり、いくつかの違いがある場合があります。

また、Firefox 10 以前では shim が必要です。

function outerHTML(el) {
    return el.outerHMTL || document.createElement('div')
                                   .appendChild(el.cloneNode(true))
                                   .parentNode
                                   .innerHTML;
}
于 2012-04-19T23:13:59.923 に答える
1

要素の html を取得するには、ネイティブ javascripts innerHTML を使用するか、jQuery を使用する場合は html() メソッドを使用します。例 ...

JavaScript:

var html = document.getElementById('myOb').innerHTML;

jQuery:

var html = $('#myOb').html();
于 2012-04-19T23:14:41.547 に答える