readonly ,disabled------display visibility

    Disabled    Readonly
button     Y    N
checkbox     Y    N
file     Y    N
hidden     N    N
image     N    N
password     Y    Y
radio     Y    N
reset     Y    N
submit     Y    N
text     Y    Y
select    Y    N
textarea    Y    Y



    function fn_hidden(){
        /*visibility is good .no format change 
        */
    
        document.getElementById("rad_1").style.visibility="hidden";
        document.getElementById("rad_2").style.display="none";
    }
    
    
    function fn_show(){
        document.getElementById("rad_1").style.visibility="visible";
        document.getElementById("rad_2").style.display="inline";
        //document.getElementById("rad_2").style.display="block";  // 加上2行空行在首尾
    }

 

 

表单标签包括
http://www.w3school.com.cn/html/html_forms.asp
<form> 定义供用户输入的表单
<input> 定义输入域
<textarea> 定义文本域 (一个多行的输入控件)
<label> 定义一个控制的标签
<fieldset> 定义域
<legend> 定义域的标题
<select> 定义一个选择列表
<optgroup> 定义选项组
<option> 定义下拉列表中的选项
<button> 定义一个按钮
<isindex> 已废弃。有<input>代替。


其中有一个input
根据input的 type属性,又可以分成不同的
button
checkbox
file
hidden
image
password
radio
reset
submit
text

==========================================================================================================

HTML <style> 标签引入CSS
http://www.w3school.com.cn/tags/tag_style.asp

1.
<head>
<style type="text/css">
h1 {color:red}
p {color:blue}
</style>
</head>

2.
<head>
<link rel="stylesheet" type="text/css" href="theme.css" />
</head>


style的属性,写法在javascript中   ==CSS在JS中的用法
HTML DOM Style 对象
http://www.w3school.com.cn/htmldom/dom_obj_style.asp
<html>
<head>
<script type="text/javascript">
function setTextDecoration()
{
document.getElementById("p1").style.textDecoration="overline";
}
</script>
</head>
<body>

<p id="p1">This is an example paragraph.</p>

<input type="button" onclick="setTextDecoration()" value="Set text-decoration" />

</body>
</html>

 


style的属性,写法在HTML中,其实就是CSS在HTML中的用法
CSS 参考手册
http://www.w3school.com.cn/css/css_reference.asp
<html>
<head>
<style type="text/css">
h1 {text-decoration: overline}
h2 {text-decoration: line-through}
h3 {text-decoration: underline}
h4 {text-decoration:blink}
a {text-decoration: none}
</style>
</head>

<body>
<h1>这是标题 1</h1>
<h2>这是标题 2</h2>
<h3>这是标题 3</h3>
<h4>这是标题 4</h4>
<p><a href="http://www.w3school.com.cn/index.html">这是一个链接</a></p>
</body>

</html>

=====================================================================================================

这2个属性是style的东东(所有控件都支持)
display
visibility

html:

  <input id="rad_1"  type="radio" name="rad_gp1" value="first"   readonly="readonly"   style="display:inline; visibility:hidden " />

js;
document.getElementById("rad_1").style.visibility="hidden";
document.getElementById("rad_2").style.display="none";
document.getElementById("rad_1").style.visibility="visible";
document.getElementById("rad_2").style.display="inline";

 

=======================================================================================
这2个属性是控件的属性
readonly  (仅仅对textarea,text,password支持)
disabled

js:
document.getElementById("rad_1").disabled=false;
document.getElementById("rad_1").disabled=true;
document.getElementById("text").readOnly=true;   //大小写
document.getElementById("text").readOnly=false;

html:
<textarea readonly="readonly"  disabled="disabled"> //赋的是什么值

html都用ID来取好
当然checkbox,radio也可以用name得到的是数组!!因为分组

但是后台必须用name来去拿前台传过去的数据,如果没有在前台定义name,是传不过去的!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!

每一种都分为html (CSS)写法和DOM(JS)写法两种

//display ,visibility,readonly,disabled是否可以传值到后台??只有readonly可以 (select 和option分别有disabled!!)

//Document对象
http://www.w3school.com.cn/htmldom/dom_obj_document.asp

//Dom的例子很好
http://www.w3school.com.cn/example/hdom_examples.asp
//Dom的结点
http://www.w3school.com.cn/htmldom/dom_nodes_access.asp


//js string对象
http://www.w3school.com.cn/js/jsref_obj_string.asp
//js 数组
http://www.w3school.com.cn/js/js_obj_array.asp
//js所有
注意的是左侧有js计时
http://www.w3school.com.cn/js/js_timing.asp


 

 

 

posted on 2009-09-22 18:52  dolphin_bobo  阅读(406)  评论(0编辑  收藏  举报

导航