为按钮注册事件后，当点击事件发生时，将div元素的宽高获取至div元素内，使用jQuery在一个100px的盒里展示此效果

当你想要在用户点击按钮时动态获取并显示`div`元素的宽高，可以使用jQuery来实现这个功能。首先，你需要确保`div`元素已经添加到了页面上，并且已经被选中以便于操作。以下是一个简单的步骤：

1. **HTML结构**:

<button id="myButton">点击获取宽度</button>
<div id="myDiv" style="width: 100px; height: 150px;"></div>

2. **JavaScript/jQuery 部分**:

$(document).ready(function() {
    // 获取初始div元素宽高
    var getDivSize = function() {
        var divWidth = $('#myDiv').width();
        var divHeight = $('#myDiv').height();
        return { width: divWidth, height: divHeight };
    };

    // 给按钮添加click事件处理函数
    $('#myButton').on('click', function() {
        // 当点击按钮时，获取div的尺寸，并更新显示区域
        var dimensions = getDivSize();

        // 创建一个新的div用于显示尺寸信息，假设这是另一个id为'dimensionsDisplay'的div
        var displayDiv = $('<div>').text('宽度: ' + dimensions.width + 'px, 高度: ' + dimensions.height + 'px');
        
        // 将显示内容插入到100px大小的容器内，这里假设这个容器id为'resultContainer'
        $('#resultContainer').append(displayDiv);
    });
});

在这个例子中，当你点击那个带ID为`myButton`的按钮时，会创建一个新的`<div>`标签，并显示`myDiv`的当前宽度和高度。