js高手帮忙解释下，解释的越详细越好啊！
<script>(function(){varo=document.getElementById("hutia");vars=o.innerHTML;varp=docum...
<script>
(function(){
var o = document.getElementById("hutia");
var s = o.innerHTML;
var p = document.createElement("span");
var n = document.createElement("a");
p.innerHTML = s.substring(0,10);
n.innerHTML = s.length > 10 ? "...展开" : "";
n.href = "###";
n.onclick = function(){
if (n.innerHTML == "...展开"){
n.innerHTML = "收起";
p.innerHTML = s;
}else{
n.innerHTML = "...展开";
p.innerHTML = s.substring(0,10);
}
}
o.innerHTML = "";
o.appendChild(p);
o.appendChild(n);
})();
</script> 展开
(function(){
var o = document.getElementById("hutia");
var s = o.innerHTML;
var p = document.createElement("span");
var n = document.createElement("a");
p.innerHTML = s.substring(0,10);
n.innerHTML = s.length > 10 ? "...展开" : "";
n.href = "###";
n.onclick = function(){
if (n.innerHTML == "...展开"){
n.innerHTML = "收起";
p.innerHTML = s;
}else{
n.innerHTML = "...展开";
p.innerHTML = s.substring(0,10);
}
}
o.innerHTML = "";
o.appendChild(p);
o.appendChild(n);
})();
</script> 展开
展开全部
(function(){
var o = document.getElementById("hutia"); //获取当前页面ID为hutia的元素并保存到变量o中
var s = o.innerHTML; //获取上一步此元素中的HTML代码。（HTML代码是包含样式的，而 innerText只有文字不包含任何样式）
var p = document.createElement("span"); //新建一个span元素，并保存到变量p中。
var n = document.createElement("a"); //新建一个a元素，并保存到变量n中。
p.innerHTML = s.substring(0,10); //设置上面新建的span元素的内容，也就是 <span>我是内容</span> 中包含的内容。其中内容只截取ID为hutia中的前十个字符。
n.innerHTML = s.length > 10 ? "...展开" : ""; //设置上面新建的a元素的内容，也就是 <a>我是内容</a> 中包含的内容。其中条件为：如果span元素包含的字符长度超过10则设置内容为“...展开”，否则设置内容为空
n.href = "###"; //设置上面新建的a元素的属性href（链接地址）为“###”
n.onclick = function(){ //设置上面新建的a元素的单击触发的事件。
if (n.innerHTML == "...展开"){ //如果a元素的内容等于"...展开"
n.innerHTML = "收起"; //设置a元素的内容等于“收起”
p.innerHTML = s; //设置span元素的内容等于s变量中的内容
}else{ //否则
n.innerHTML = "...展开"; //设置a元素的内容等于“展开”
p.innerHTML = s.substring(0,10); //设置span元素的内容等于s变量中的前10个符
}
}
o.innerHTML = ""; //设置ID为hutia的元素的内容为空
o.appendChild(p); //把a元素加入到当前页面（显示出来）
o.appendChild(n); //把span元素加入到当前页面（显示出来）
})();
</script>
var o = document.getElementById("hutia"); //获取当前页面ID为hutia的元素并保存到变量o中
var s = o.innerHTML; //获取上一步此元素中的HTML代码。（HTML代码是包含样式的，而 innerText只有文字不包含任何样式）
var p = document.createElement("span"); //新建一个span元素，并保存到变量p中。
var n = document.createElement("a"); //新建一个a元素，并保存到变量n中。
p.innerHTML = s.substring(0,10); //设置上面新建的span元素的内容，也就是 <span>我是内容</span> 中包含的内容。其中内容只截取ID为hutia中的前十个字符。
n.innerHTML = s.length > 10 ? "...展开" : ""; //设置上面新建的a元素的内容，也就是 <a>我是内容</a> 中包含的内容。其中条件为：如果span元素包含的字符长度超过10则设置内容为“...展开”，否则设置内容为空
n.href = "###"; //设置上面新建的a元素的属性href（链接地址）为“###”
n.onclick = function(){ //设置上面新建的a元素的单击触发的事件。
if (n.innerHTML == "...展开"){ //如果a元素的内容等于"...展开"
n.innerHTML = "收起"; //设置a元素的内容等于“收起”
p.innerHTML = s; //设置span元素的内容等于s变量中的内容
}else{ //否则
n.innerHTML = "...展开"; //设置a元素的内容等于“展开”
p.innerHTML = s.substring(0,10); //设置span元素的内容等于s变量中的前10个符
}
}
o.innerHTML = ""; //设置ID为hutia的元素的内容为空
o.appendChild(p); //把a元素加入到当前页面（显示出来）
o.appendChild(n); //把span元素加入到当前页面（显示出来）
})();
</script>
更多追问追答
追问
(function(){
var o = document.getElementById("hutia"); //获取当前页面ID为hutia的元素并保存到变量o中
请问怎么看出来是id，而不是class的呢？
还有个问题，如何更改 "展开" "收起" 的样式？
追答
getElementById
通过这个方法，这是四个单词的结合，get，element，by，id 可理解为获取元素ID。
至于样式的话，可以通过CSS进行修改。这需要懂一定的CSS
本回答由提问者推荐
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
