先端基本功--Js実戦5 11.05
5013 ワード
一、1.ノード属性getAttribute(属性)取得属性
マイクロブログの小さなインスタンスを発行し、ノードの削除を追加することにより、ノードの削除を追加する動作の考え方を鍛える.
alert(demo.getAttribute("title"));
2.ノード属性SetAttribute(「プロパティ」、「値」)を設定し、属性をどの値div.setAttribute(“class”,”demo”);
3に変更しますか?ある属性removeAttribute(「プロパティ」)を削除します.demo.removeAttribute(“title”)
A.apped Child(B);BさんはA子に違いないです.bさんはaの中に入れて、一番後ろに入れました.bはaに入れるA.insertBefore(B,C)B Cは全部Aの子供です.bをaに入れますが、cの前です.二、動的に小さな円を生成するwindow.onload = function () {
var scroll = document.getElementById('scroll');
var yuan = document.createElement("div");
scroll.appendChild(yuan);// scroll yuan
yuan.setAttribute("class","yuan"); //
var ul = document.getElementById('ul');
var lis = ul.children; //ul
for (var i = 0 ; i < lis.length ; i++) {
var newspan = document.createElement("span"); // span
newspan.innerHTML = i+1; //
yuan.appendChild(newspan); // yuan
}
}
三、マイクロブログの小さなインスタンスを発行し、ノードの削除を追加することにより、ノードの削除を追加する動作の考え方を鍛える.
window.onload = function () {
var btn = document.getElementsByTagName('button')[0];
var txt = document.getElementsByTagName('textarea')[0];
var ul = document.createElement("ul");
btn.parentNode.appendChild(ul);
btn.onclick = function(){
if (txt.value == "") {
alert(" !");
return false;
}
var newli = document.createElement("li"); // for
newli.innerHTML = txt.value + "<a href = 'javascript:;'> </a>";
ul.appendChild(newli);
txt.value = "" ;
//
var lis = ul.children;
if (lis.length == 0){
ul.appendChild(newli);
}// , ul
else {
ul.insertBefore(newli,lis[0]);
}// lis
//
var as = document.getElementsByTagName("a");// a
for (i = 0 ; i < as.length; i++){
as[i].onclick = function(){
ul.removeChild(this.parentNode);
// a li , , ul a li
}
}
}
</code></pre>
<p><strong> 、 : , , 。</strong><br> <strong> 、 </strong><br> 1.Date() , 。<br> <code>var date = new Date();</code> // <br> console.log(date.getTime()); // <br> console.log(date.valueOf());<br> console.log(Date.now());// <br> console.log(+new Date());<br> 。<br> 2. <br> getDate() 1-31<br> getDay () 0-6<br> getMonth () 0-11<br> getFullYear () ( )<br> getHours () 0-23<br> getMinutes () 0-59<br> getSeconds () 0-59<br> getMilliseconds () <br> getTime () ( 1970/1/1 )</p>
<ol start="3">
<li> </li>
</ol>
<pre><code><script type="text/javascript">
window.onload = function () {
var box = document.getElementById('box');
var child = box.children;
var date = new Date();//
var arr = [" " ," " ," " ," " ," " ," " ," " ,]
child[0].innerHTML = date.getFullYear()+" "+(date.getMonth()+1)+" "+date.getDate()+" "+" " + arr[date.getDay()];// , 。
child[1].innerHTML = date.getDate();
}
window.setInterval(“ ”, )
set Interval(fun,1000)1000ミリ秒ごとに1秒ごとにFnという関数を実行します.set Interval(fun(1000)はset Interval(function){},1000)setInterval(fun(1000)のエラーの5.カウントダウンは将来の時間で現在の時間を減算します.将来のミリ秒数-現在のミリ秒数を連続的に変換すればいいです.
window.onload = function(){
var demo = document.getElementById('demo');
var endTime = new Date("2017/11/11 00:00");//
setInterval(clock,1000);
function clock(){
var nowTime = new Date(); // ,
var second= parseInt((endTime.getTime() - nowTime.getTime())/1000);
//
var d = parseInt(second/3600/24); //
var h = parseInt(second/3600%24);
var m = parseInt(second/60%60);
var s = parseInt(second%60);
d<10 ? d="0"+d : d;
h<10 ? h="0"+h : h;
m<10 ? m="0"+m : m;
s<10 ? s="0"+s : s; // !!
demo.innerHTML = " :"+d+" "+h+" "+m+" "+s+" ";
}
}
まとめ:まず終了時間を定義して、タイマーを呼び出して、タイミング関数で現在の時間を取得し、残りの時間を計算して、そのあとの時間を計算します.