 ホーム KeyNavi対応方法 [0] JavaScript＠Keynavi.Netトップ
[1] 要素の属性リストを取得
|
・サイトマップ [Shift-S] |
 |
■ 要素の属性リストを取得
JavaScriptで発展的な機能を実装する場合や
ブラウザ間互換性を考える場合、
各要素にどのような属性があるか知りたくなります。
<script language="javascript" src="http://www.keynavi.net/files/keynavi_ja.js"></script>
<script language="javascript"><!--
e=document.links[0]; //←これを色々変更して実験してみてください
function tostr(e,i){
if(KL_IE5 || KL_NS6 || KL_OP6){
return eval("try { e[i]+'' }catch(err){ '(skipped!)' }");
}
return e[i]+'';
}
v=new Array();
for(var i in e){
v[v.length]="<tr><td>"+i+"</td><td>"+tostr(e,i)+"</td></tr>";
}
v.sort();
kl_replace("lay1","<table border=1>"+v.join("")+"</table>");
//-->
</script>
ここでは要素の中身を動的に変更：kl_replace(id,s,mode) を利用して 要素の属性の一覧を作成してみます。
【要素の属性リストを表にして要素「id=lay1」に出力】
<script language="javascript" src="http://www.keynavi.net/files/keynavi_ja.js"></script>
<script language="javascript"><!--
e=document.links[0]; //←これを色々変更して実験してみてください
function tostr(e,i){
if(KL_IE5 || KL_NS6 || KL_OP6){
return eval("try { e[i]+'' }catch(err){ '(skipped!)' }");
}
return e[i]+'';
}
v=new Array();
for(var i in e){
v[v.length]="<tr><td>"+i+"</td><td>"+tostr(e,i)+"</td></tr>";
}
v.sort();
kl_replace("lay1","<table border=1>"+v.join("")+"</table>");
//-->
</script>
ランダムな順番で出力されるので ここではソートをかけて 若干読みやすくしています。
Netscape6.xでは属性によっては「e.attr」がエラーになり
スクリプトの実行が途中で中断されます。
そこでtry文内で実行するようにしてこの問題を回避しています。
【実行結果：デフォルトではIE6で実行したものを表示】
| Methods | |
| accessKey | |
| all | [object] |
| attributes | [object] |
| behaviorUrns | [object] |
| canHaveChildren | true |
| canHaveHTML | true |
| charset | |
| childNodes | [object] |
| children | [object] |
| className | klwlink |
| clientHeight | 0 |
| clientLeft | 0 |
| clientTop | 0 |
| clientWidth | 0 |
| contentEditable | inherit |
| coords | |
| currentStyle | [object] |
| dataFld | |
| dataFormatAs | |
| dataSrc | |
| dir | |
| disabled | false |
| document | [object] |
| filters | [object] |
| firstChild | [object] |
| hash | |
| hideFocus | false |
| host | void(0);:0 |
| hostname | void(0); |
| href | javascript:void(0); |
| hreflang | |
| id | |
| innerHTML | レイヤー [Shift-X] |
| innerText | レイヤー [Shift-X] |
| isContentEditable | false |
| isDisabled | false |
| isMultiLine | true |
| isTextEdit | false |
| lang | |
| language | |
| lastChild | [object] |
| mimeType | |
| name | |
| nameProp | javascript:void(0); |
| nextSibling | [object] |
| nodeName | A |
| nodeType | 1 |
| nodeValue | null |
| offsetHeight | 13 |
| offsetLeft | 325 |
| offsetParent | [object] |
| offsetTop | 4 |
| offsetWidth | 97 |
| onactivate | null |
| onafterupdate | null |
| onbeforeactivate | null |
| onbeforecopy | null |
| onbeforecut | null |
| onbeforedeactivate | null |
| onbeforeeditfocus | null |
| onbeforepaste | null |
| onbeforeupdate | null |
| onblur | null |
| oncellchange | null |
| onclick | function anonymous() { kl_hlay_toggle(); } |
| oncontextmenu | null |
| oncontrolselect | null |
| oncopy | null |
| oncut | null |
| ondataavailable | null |
| ondatasetchanged | null |
| ondatasetcomplete | null |
| ondblclick | null |
| ondeactivate | null |
| ondrag | null |
| ondragend | null |
| ondragenter | null |
| ondragleave | null |
| ondragover | null |
| ondragstart | null |
| ondrop | null |
| onerrorupdate | null |
| onfilterchange | null |
| onfocus | null |
| onfocusin | null |
| onfocusout | null |
| onhelp | null |
| onkeydown | null |
| onkeypress | null |
| onkeyup | null |
| onlayoutcomplete | null |
| onlosecapture | null |
| onmousedown | null |
| onmouseenter | null |
| onmouseleave | null |
| onmousemove | null |
| onmouseout | null |
| onmouseover | null |
| onmouseup | null |
| onmousewheel | null |
| onmove | null |
| onmoveend | null |
| onmovestart | null |
| onpage | null |
| onpaste | null |
| onpropertychange | null |
| onreadystatechange | null |
| onresize | null |
| onresizeend | null |
| onresizestart | null |
| onrowenter | null |
| onrowexit | null |
| onrowsdelete | null |
| onrowsinserted | null |
| onscroll | null |
| onselectstart | null |
| outerHTML | レイヤー [Shift-X] |
| outerText | レイヤー [Shift-X] |
| ownerDocument | [object] |
| parentElement | [object] |
| parentNode | [object] |
| parentTextEdit | [object] |
| pathname | |
| port | 0 |
| previousSibling | [object] |
| protocol | javascript: |
| protocolLong | 不明なプロトコル |
| readyState | complete |
| recordNumber | null |
| rel | |
| rev | |
| runtimeStyle | [object] |
| scopeName | HTML |
| scrollHeight | 13 |
| scrollLeft | 0 |
| scrollTop | 0 |
| scrollWidth | 97 |
| search | |
| shape | |
| sourceIndex | 24 |
| style | [object] |
| tabIndex | 0 |
| tagName | A |
| tagUrn | |
| target | |
| title | |
| type | |
| urn |
|
【JavaScript@Keynavi.Net ：
DOM編
】
「Ctrl-矢印」でフォーカスを上下左右に移動できます。
|
| トップへ戻る [1] | Back[Q] ・Top[W] ・Up[E] ・PgUp[R] ・Focus[Ctrl-矢印] |
|
|
ホーム KeyNavi対応方法 [0] JavaScript＠Keynavi.Netトップ
[1] 要素の属性リストを取得
|
・サイトマップ [Shift-S] |