Jump to content

Offsetwidth / Scrollwidth / Clientwidth


tinfanide
 Share

Recommended Posts

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>Untitled Document</title><script>var str = "This is a cat. He is running. That is a cat, too. She is sleeping.";var arr = ["cat","dog","bird"];function text(){document.getElementById("txt").innerHTML = str;}function searchString(){ var patt = new RegExp(document.getElementById("searchInput").value,"gi");document.getElementById("txt").innerHTML = str.replace(patt,"<span style='color: red'>"+document.getElementById("searchInput").value+"</span>");}window.onload = function(){text();alert( document.getElementById("txt").scrollWidth );}</script></head><style>#div {width: 600px;height: 200px;border: 5px solid #000000;}</style><body><div id="txt"></div><br /><input id="searchInput" type="text" value="" /><input type="button" onclick="searchString()" value="Search" /><br /><br /><div id="div"></div></body></html>

No matter I use offset / scroll / client width,it is 968;But I haven't set the width of the txt. even I use

window.getComputedStyle(document.getElementById("txt"),null).getPropertyValue("width")

The width is still 968(px); Why is that?

  • Like 1
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...