html如何给p标签加上行号,HTML/CSS/JS：如何用行号制作textarea的错觉？

我会从两个文本区域和同步机制开始。 这样的事情，

window.sync = function(e){

var textarea = document.getElementById("lines");

var source = document.getElementById("some_text_area");

textarea.scrollTop = source.scrollTop;

}

window.populate = function populate(){

if(populate.started){

return;

}

populate.started = true;

var textarea = document.getElementById("lines");

var str = '';

for(var i=0;i < 100;i++){

str = str + (i +'\r\n');

}

textarea.value = str;

}

style="width:40px;overflow:hidden;height:40px;"

readonly="true"

id="lines"

>

style="width:500px;height:40px;"

id="some_text_area"

οnclick="populate()"

οnscrοll="sync();"

>

Ofcourse populate()功能(和样式声明和事件声明)应该是更强大和聪明，但是，它只是为展示目的。