JavaScript 基本-面倒なコード一覧からクリップボードへ

[WEB][JavaScript 基本-面倒なコード一覧からクリップボードへ]
目次

直接ページに記述する場合

<script type="text/javascript"> <!-- // コメント // --> </script> <noscript> <table border="0" bgcolor="#ffff80" cellpadding="5"> <tbody> <tr> <td>JavaScript対応方法 <ul> <li>Internet Explorer <ul> <li>[ツール]→[インターネットオプション]→[セキュリティ] <li>[レベルのカスタマイズ]→[スクリプト]→[アクティブスクリプト] <li>[有効にする] </ul> <li>Netscape Communicator <ul> <li>[編集]→[設定]→[詳細]→[JavaScript を有効にする] </ul> </ul> </td> </tr> </tbody> </table> </noscript>
クリップボードへコピー

外部ファイルの場合

<script type="text/javascript" src="xxx/xxxxxx.js"> <!-- // コメント // --> </script> <noscript> <table border="0" bgcolor="#ffff80" cellpadding="5"> <tbody> <tr> <td>JavaScript対応方法 <ul> <li>Internet Explorer <ul> <li>[ツール]→[インターネットオプション]→[セキュリティ] <li>[レベルのカスタマイズ]→[スクリプト]→[アクティブスクリプト] <li>[有効にする] </ul> <li>Netscape Communicator <ul> <li>[編集]→[設定]→[詳細]→[JavaScript を有効にする] </ul> </ul> </td> </tr> </tbody> </table> </noscript>
クリップボードへコピー

複数外部ファイル

<script type="text/javascript" src="xxx/xxxxxx.js"></script> <script type="text/javascript" src="yyy/yyyyyy.js"></script>
クリップボードへコピー

イベント-ボタン

<button onclick="関数名()">表示文字</button>
クリップボードへコピー

イベント-ボタン-input

<input type="submit" value="表示文字" onclick="関数名()">
クリップボードへコピー

イベント-ボタン-リンク

<a href="javascript:関数名();">表示文字</a>
クリップボードへコピー

イベント-ボタン-生成

document.write('<FORM>'); document.write('<INPUT type="button" name="ボタンID" value="表示文字" onClick="関数名()">'); document.write('</FORM>');
クリップボードへコピー

Confirmボックス

if(confirm("メッセージ")){ //[OK]処理 }else{ //[キャンセル]処理 }
クリップボードへコピー

アラート

  • デバッグに必要
alert("メッセージ");
クリップボードへコピー

チェックボックス

<input type="checkbox" id="名前" onchange="関数名()">
クリップボードへコピー

チェックボックス-値の受け取り

function 関数名() { if(名前.checked==1) //チェックtrue else //チェックfalse }
クリップボードへコピー

セレクトボックス

<select id="名前" onchange="return 関数名()"> <option value="">- 表示文字 -</option> <option id="なまえ1" value="値">表示文字</option> <option id="なまえ2" value="値">表示文字</option> </select>
クリップボードへコピー

セレクトボックス-値の受け取り

function 関数名() { var 変数ア=document.getElementById("名前"); var 変数イ="なまえ"+変数ア.selectedIndex; var 変数ウ=document.getElementById(変数イ); var 変数エ="メッセージ"+変数ウ.text+"メッセージ";//表示文字取得 var 変数オ="メッセージ"+変数ウ.value+"メッセージ";//値取得   変数ア.selectedIndex=0; }
クリップボードへコピー

1-1取得又は表示-id-<td>テキスト

  • getElementById
  • DOM対応ブラウザ
  • id属性を参照
  • <table><td id="名前">テキスト</td></table>
document.getElementById("名前").innerText // 以降[$("名前")]だけで取得可能にする function $(id){ return document.getElementById(id); } $("名前").innerText
クリップボードへコピー

1-2取得又は表示-id-<td>タグ

  • getElementById
  • DOM対応ブラウザ
  • id属性を参照
  • <table><td id="名前">タグ</td></table>
document.getElementById("名前").innerHTML // 以降[$("名前")]だけで取得可能にする function $(id){ return document.getElementById(id); } $("名前").innerHTML
クリップボードへコピー

1-3取得又は表示-id-<input>テキスト

  • getElementById
  • DOM対応ブラウザ
  • id属性を参照
  • <input id="名前">
document.getElementById("名前").value // 以降[$("名前")]だけで取得可能にする function $(id){ return document.getElementById(id); } $("名前")
クリップボードへコピー

2-1取得又は表示-name-<td>テキスト

  • getElementsByName
  • documentオブジェクトのみ参照可能
  • DOM対応ブラウザ
  • name属性を参照
  • <table><td name="名前">テキスト</td></table>
document.getElementsByName("名前").innerText // 以降[$("名前")]だけで取得可能にする function $(id){ return document.getElementsByName(id); } $("名前").innerText
クリップボードへコピー

2-2取得又は表示-name-<td>タグ

  • getElementsByName
  • documentオブジェクトのみ参照可能
  • DOM対応ブラウザ
  • name属性を参照
  • <table><td name="名前">タグ</td></table>
document.getElementsByName("名前").innerHTML // 以降[$("名前")]だけで取得可能にする function $(id){ return document.getElementsByName(id); } $("名前").innerHTML
クリップボードへコピー

2-3取得又は表示-name-<input>テキスト

  • getElementsByName
  • documentオブジェクトのみ参照可能
  • DOM対応ブラウザ
  • name属性を参照
  • <input name="名前">
document.getElementsByName("名前").value // 以降[$("名前")]だけで取得可能にする function $(id){ return document.getElementsByName(id); } $("名前")
クリップボードへコピー

取得又は表示-id-<table>配列テキスト

  • DOM対応ブラウザ
  • id属性を参照
  • 複数多数のセル値をもつテーブル参照
document.getElementById('名前').rows[数値].cells[数値].innerText
クリップボードへコピー

取得又は表示-id-<table>配列タグ

  • DOM対応ブラウザ
  • id属性を参照
  • 複数多数のセル値をもつテーブル参照
document.getElementById('名前').rows[数値].cells[数値].innerHTML
クリップボードへコピー

取得又は表示-タグ名

  • DOM対応ブラウザ
  • id属性もname属性も無い場合
document.getElementsByTagName("タグ名")
クリップボードへコピー

OK/キャンセルメッセージ

var a = confirm("質問");
クリップボードへコピー

入力ダイアログ

var a = prompt("メッセージ","デフォルト値");
クリップボードへコピー