JSノード(プロパティ操作)隠し表示(display)

JavaScriptでコントロールを隠す方法には、コントロールのstyleを設定する「display」と「visibility」の属性があります.style.display=「block」またはstyle.visibility=「visible」の時にコントロールまたは参照すると、style.display=「none」またはstyle.visibility=「hidden」の時にコントロールが見えません.「display」は隠しコントロールだけではなく、隠しコントロールが表示時の位置を占有しなくなります.「visibility」は隠しコントロールを非表示にするだけで、コントロールは元の位置を占めます.

<script language="JavaScript">
function displayHideUI()
{
     var ui = document.getElementById("bbs");
     ui.style.display="none";
}
function displayShowUI()
{
     var ui = document.getElementById("bbs");
     ui.style.display=" ";//display       ， block         
}
function visibilityHideUI()
{
     var ui = document.getElementById("bbs");
     ui.style.visibility="hidden";
}
function visibilityShowUI()
{
     var ui = document.getElementById("bbs");
     ui.style.visibility="visible";
}
</script>

値                noneという要素は表示されません.blockという要素はブロックレベルの要素として表示されます.この要素は前後に改行があります.inlineのデフォルト.この要素はインライン要素として表示されます.要素の前後に改行がありません.ラインブロック要素(CSS 2.1新規の値)list-intemこの要素はリストとして表示されます.この要素はコンテキストに応じてブロックレベルの要素またはインライン要素として表示されます.compect CSSにはcomppactの値がありますが、幅広いサポートがないため、すでにCSS 2.1から削除されました.マーカーCSSには値マーカーがありますが、幅広いサポートがないため、CSS 2.1から削除されました.テーブルのこの要素は、ブロックレベルのテーブルとして表示されます.テーブルの前後に改行があります.inline-tableこの要素はインライン表として表示されます.表の前後に改行がありません.テーブル-row-groupこの要素は、1つ以上の行のグループとして表示されます.table-header-groupこの要素は、1つ以上の行のグループとして表示されます.table-footer-groupこの要素は、1つ以上の行のグループとして表示されます.テーブルの行として表示されます.テーブル-column-groupこの要素は、1つ以上の列のグループとして表示されます.テーブルのセルとして表示されます.テーブルのセルとして表示されます.この要素はテーブルのセルとして表示されます.テーブルのタイトルとして表示されます.

<script language="JavaScript">
<!--
 function changeShowImage(n){
  var cNodes = document.getElementsByClassName("mediumn_image");
  console.log("22222");
  console.log(cNodes);
  for(var i=0;i<cNodes.length;i++){
   console.log(cNodes[i]);
   cNodes[i].style.display = "none";
  }
  var nNode = document.getElementById(n);
  nNode.style.display = "";
 }
//--> 
</script>

 
インターフェース
nodeType定数
nodeType値
コメント
Element
Node.ELLENT_NODE
1
元素ノード
Text
ノード.TEXT_NODE
3
テキストノード
Dcument
ノード.DOCUMENT_NODE
9
document
コメント
Node.C.OMMENT_NODE
8
コメントのテキスト
DcumentFragment
ノード.DOCUMENT_FRAGMENTNODE
11
documentフラグメント
Attr
ノード.ATTRIBUTE_NODE
2
ノードのプロパティ
 
 
方法
説明
createAttribute()
指定された名前で新しいAttrノードを作成します.
createComments()
指定された文字列で新しいCommentノードを作成します.
createElement()
指定されたマーク名で新しいElementノードを作成します.
createText Node()
指定されたテキストで新しいTextNodeノードを作成します.
getElemenntById()
ドキュメント内のID属性を指定するElementノードを返します.
getElements ByTagName()
ドキュメントに指定されたマーク名を持つすべてのElementノードを返します.
 
属性
説明
atributes
ノードがElementである場合、NamedNodeMapとして要素の属性を返します.
childNodes
Node[]の形で現在のノードのサブノードを格納する.サブノードがない場合は、空の配列を返します.
first Child
Nodeの形で現在のノードの第1のサブノードを返します.サブノードがない場合は、nullとなります.
lastChild
Nodeの形で現在のノードの最後のサブノードを返します.サブノードがない場合は、nullとなります.
nextSibling
Nodeの形で現在のノードの兄弟の次のノードに戻ります.このようなノードがない場合は、nullに戻ります.次の兄弟ノード
nodeName
ノード名、Elementノード名はElementを表します.
nodeType
ノードのタイプを表します.
parent Node
Nodeの形で現在のノードの親ノードに戻る.親ノードがない場合はnullとなります.
previous Sibling
Nodeという形で現在のノードに隣接し、その前に位置する兄弟ノードを返します.このようなノードがない場合は、nullに戻ります.前の兄弟ノード
 
方法
説明
apped Child()
ノードを現在のノードのchildNodes［］グループに追加することにより、ドキュメントツリーにノードを追加します.
clone Node()
現在のノードをコピーしたり、現在のノードおよびそのすべての子孫ノードをコピーしたりします.
has Child Nodes()
現在のノードがサブノードを持っている場合、trueに戻ります.
insertBefore()
ドキュメントツリーにノードを挿入し、現在のノードの指定のサブノードの前に位置します.ノードが既に存在する場合は、削除してその位置に挿入する.
removeChild()
文書ツリーから削除し、指定されたサブノードに戻ります.
replacceChild()
指定されたサブノードをドキュメントツリーから削除して返し、他のノードで置換します.