自定義改變的值(分享)
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" Content="text/html; charset=utf-8" />
<title>javascript</title>
<style type="text/css">
body{font-size:12px;}
#txt{
? ? height:400px;
? ? width:600px;
border:#333 solid 1px;
padding:5px;}
p{
line-height:18px;
text-indent:2em;}
</style>
</head>
<body>
? <h2 id="con">JavaScript</H2>
? <div id="txt">?
? ? ?<h5>------------H5------------</h5>
? ? ? ? <p>1. JavaScript</p>
? ? ? ? <p>2. PHP</p>
? ? ? ? <p>3. C++</p>
<p>4. Vue.js</p>
? </div>
? <form>
? <!--當(dāng)點(diǎn)擊相應(yīng)按鈕,執(zhí)行相應(yīng)操作,為按鈕添加相應(yīng)事件-->
? ? <input type="button" value="改變顏色" onclick="changeColor()">??
? ? <input type="button" value="改變寬高" onclick="changeWidthAndHeight()">
? ? <input type="button" value="隱藏內(nèi)容" onclick="disapearTxt()">
? ? <input type="button" value="顯示內(nèi)容" onclick="apeartxt()">
? ? <input type="button" value="取消設(shè)置" onclick="cancel()">
? </form>
? <script type="text/javascript">
? var _h2=document.getElementById("con");
? var _div=document.getElementById("txt");
//定義"改變顏色"的函數(shù)
function changeColor()
{
? ? var changeVlue1=prompt('您要把h2它變成什么顏色?');//_h2
? ? var _h2Color=confirm("您確定嗎?");
? ? if(_h2Color==true||changeVlue1!=null)
? ? {
? ? ? ? _h2.style.color=changeVlue1;
? ? }
? ? var changeVlue2=prompt('您要把div變成什么顏色?');//_div
? ? var _divColor=confirm("您確定嗎?");
? ? if(_divColor==true||changeVlue2!=null)
? ? {
? ? ? ? _div.style.color=changevlue2;
? ? }
}
//定義"改變寬高"的函數(shù)
function changeWidthAndHeight()
{
? ? var changeVlue1=prompt('您要把它變成多寬?');//_h2
? ? var _h2Width=confirm("您確定嗎?");
? ? if(_h2Width==true||changeVlue1!=null)
? ? {
? ? ? ? ?_h2.style.width=changeVlue1;
? ? }
? ? var changeVlue2=prompt('您要把它變成多高?');//_h2
? ? var _h2Height=confirm("您確定嗎?");
? ? if(_h2Height==true||changeVlue2!=null)
? ? {
? ? ? ? ?_h2.style.Height=changeVlue2;
? ? }
? ? var changeVlue3=prompt('您要把它變成多寬?');//_div
? ? var _divWidth=confirm("您確定嗎?");
? ? if(_divWidth==true||changeVlue3!=null)
? ? {
? ? ? ? ?_div.style.width=changeVlue3;
? ? }? ?
? ? var changeVlue4=prompt('您要把它變成多高?');//_div
? ? var _divHeight=confirm("您確定嗎?");
? ? if(_divHeight==true||changeVlue4!=null)
? ? {
? ? ? ? ?_div.style.Height=changeVlue4;
? ? }? ?
}
//定義"隱藏內(nèi)容"的函數(shù)
function disapearTxt()
{
? ? var _h2None=confirm("您確定隱藏h2嗎?");
? ? if(h2None==true)
? ? {
? ? ? ? _h2.style.display="none";
? ? }
? ? var _divNone=confirm("您確定隱藏div嗎?");
? ? if(_divNone==true)
? ? {
? ? ? ? _div.style.display="none";
? ? }
}
//定義"顯示內(nèi)容"的函數(shù)
function apear()
{
? ? var _h2Block=confirm("您確定模塊化顯示h2嗎?");
? ? if(_h2Block==true)
? ? {
? ? ? ? _h2.style.display="block";
? ? }
? ? var _divBlock=confirm("您確定模塊化顯示div嗎?");
? ? if(_divBlock==true)
? ? {
? ? ? ? _div.style.display="block";
? ? }
}
//定義"取消設(shè)置"的函數(shù)
function cancel()
{
? ? var _cancel= confirm("是否取消設(shè)置?");
? ? if( _cancel == true)
? ? {
? ? ? ? _h2.removeAttribute("style");
? ? ? ? _div.removeAttribute("style");
? ? }
}
? </script>
</body>
</html>
2019-08-05
顯示函數(shù)應(yīng)該是apeartxt寫錯(cuò)了